JQuery select(下拉框)操作方法汇总


Posted in Javascript onApril 15, 2015

JQuery select(下拉框)操作方法汇总

1. 获取选中项:
获取选中项的Value值:

$('select#sel option:selected').val();

或者
$('select#sel').find('option:selected').val();

获取选中项的Text值:
$('select#seloption:selected').text();

或者
$('select#sel').find('option:selected').text();

2.   获取当前选中项的索引值:
$('select#sel').get(0).selectedIndex;

3.   获取当前option的最大索引值:
$('select#sel option:last').attr("index")

4.   获取DropdownList的长度:
$('select#sel')[0].options.length;

或者
$('select#sel').get(0).options.length;

5.  设置第一个option为选中值:
$('select#sel option:first').attr('selected','true')

或者
$('select#sel')[0].selectedIndex = 0;

6.   设置最后一个option为选中值:
$('select#sel option:last).attr('selected','true')

7.   根据索引值设置任意一个option为选中值:
$('select#sel')[0].selectedIndex =索引值;索引值=0,1,2....

8.   设置Value=4 的option为选中值:
$('select#sel').attr('value','4');

或者
$("select#sel option[value='4']").attr('selected', 'true');

9.   删除Value=3的option:
$("select#sel option[value='3']").remove();

10.删除第几个option:
$(" select#sel option ").eq(索引值).remove();索引值=0,1,2....

如删除第3个Radio:
$(" select#sel option ").eq(2).remove();

11.删除第一个option:
$(" select#sel option ").eq(0).remove();

或者
$("select#sel option:first").remove();

12. 删除最后一个option:
$("select#sel option:last").remove();

13. 删除dropdownlist:
$("select#sel").remove();

14.在select后面添加一个option:
$("select#sel").append("<option value='6'>f</option>");

15. 在select前面添加一个option:
$("select#sel").prepend("<option value='0'>0</option>");

16. 遍历option:
$(' select#sel option ').each(function (index, domEle) {

//写入代码

});
Javascript 相关文章推荐
在网页中控制wmplayer播放器
Jul 01 Javascript
理解JavaScript中的事件
Sep 23 Javascript
jquery 插件 人性化的消息显示
Jan 21 Javascript
Mootools 1.2教程 Fx.Morph、Fx选项和Fx事件
Sep 15 Javascript
JQUBAR1.1 jQuery 柱状图插件发布
Nov 28 Javascript
js实现页面转发功能示例代码
Aug 05 Javascript
js生成的验证码的实现与技术分析
Sep 17 Javascript
jQuery Easyui实现左右布局
Jan 26 Javascript
javascript表单控件实例讲解
Sep 13 Javascript
ES6中Proxy与Reflect实现重载(overload)的方法
Mar 30 Javascript
浅谈Angular 中何时取消订阅
Nov 22 Javascript
vue基于两个计算属性实现选中和全选功能示例
Feb 08 Javascript
JavaScript控制网页层收起和展开效果的方法
Apr 15 #Javascript
JS扩展方法实例分析
Apr 15 #Javascript
JavaScript实现简单的二级导航菜单实例
Apr 15 #Javascript
JQuery radio(单选按钮)操作方法汇总
Apr 15 #Javascript
JavaScript判断前缀、后缀是否是空格的方法
Apr 15 #Javascript
JQuery控制radio选中和不选中方法总结
Apr 15 #Javascript
jquery插件star-rating.js实现星级评分特效
Apr 15 #Javascript
You might like
html静态页面调用php文件的方法
2014/11/13 PHP
[原创]ThinkPHP中SHOW_RUN_TIME不能正常显示运行时间的解决方法
2015/10/10 PHP
js 判断checkbox是否选中的实现代码
2010/11/23 Javascript
捕获浏览器关闭、刷新事件不同情况下的处理方法
2013/06/02 Javascript
js实现倒计时时钟的示例代码
2013/12/17 Javascript
JQuery解析HTML、JSON和XML实例详解
2014/03/29 Javascript
一个简单的Node.js异步操作管理器分享
2014/04/29 Javascript
动态载入js提高网页打开速度的方法
2014/07/04 Javascript
jQuery.Highcharts.js绘制柱状图饼状图曲线图
2015/03/14 Javascript
javascript实现九宫格相加数值相等
2020/05/28 Javascript
基于jQuery下拉选择框插件支持单选多选功能代码
2016/06/07 Javascript
浅谈jQuery中Ajax事件beforesend及各参数含义
2016/12/03 Javascript
jQuery中animate的几种用法与注意事项
2016/12/12 Javascript
深入理解Vue 组件之间传值
2018/08/16 Javascript
vue v-for 使用问题整理小结
2019/08/04 Javascript
jQuery实现全选、反选和不选功能的方法详解
2019/12/04 jQuery
React学习之JSX与react事件实例分析
2020/01/06 Javascript
如何在postman中添加cookie信息步骤解析
2020/06/30 Javascript
[00:43]DOTA2小紫本全民票选福利PA至宝全方位展示
2014/11/25 DOTA
[46:14]VGJ.T vs Liquid 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
Python urllib模块urlopen()与urlretrieve()详解
2013/11/01 Python
Python使用urllib2获取网络资源实例讲解
2013/12/02 Python
Linux 发邮件磁盘空间监控(python)
2016/04/23 Python
Python选课系统开发程序
2016/09/02 Python
pytorch .detach() .detach_() 和 .data用于切断反向传播的实现
2019/12/27 Python
pytorch模型预测结果与ndarray互转方式
2020/01/15 Python
Python使用shutil模块实现文件拷贝
2020/07/31 Python
python实现扫雷游戏的示例
2020/10/20 Python
欧舒丹比利时官网:L’OCCITANE比利时
2017/04/25 全球购物
俄罗斯的精英皮具:Wittchen
2018/01/29 全球购物
static关键字的用法
2013/10/07 面试题
四风问题自查报告剖析材料
2014/02/08 职场文书
珠宝店促销方案
2014/03/21 职场文书
优秀团员事迹材料1000字
2014/08/20 职场文书
个人租房协议书(范本)
2014/10/14 职场文书
投资申请报告
2015/05/19 职场文书