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 相关文章推荐
javascript编程起步(第二课)
Feb 27 Javascript
jquery.tmpl JQuery模板插件
Oct 10 Javascript
js中的事件捕捉模型与冒泡模型实例分析
Jan 10 Javascript
javascript 应用小技巧方法汇总
Jul 05 Javascript
JS实现从网页顶部掉下弹出层效果的方法
Aug 06 Javascript
javascript实现瀑布流加载图片原理
Feb 02 Javascript
TypeScript Type Innference(类型判断)
Mar 10 Javascript
浏览器兼容的JS写法总结
Apr 27 Javascript
js基于cookie记录来宾姓名的方法
Jul 19 Javascript
js document.getElementsByClassName的使用介绍与自定义函数
Nov 25 Javascript
浅谈Express.js解析Post数据类型的正确姿势
May 30 Javascript
Vue实现跑马灯样式文字横向滚动
Nov 23 Vue.js
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
POSIX 风格和兼容 Perl 风格两种正则表达式主要函数的类比(preg_match, preg_replace, ereg, ereg_replace)
2010/10/12 PHP
php排序算法(冒泡排序,快速排序)
2012/10/09 PHP
php使用百度翻译api示例分享
2014/01/31 PHP
分享一段php获取linux服务器状态的代码
2014/05/27 PHP
php通过smtp邮件验证登陆的方法
2016/05/11 PHP
php使用Jpgraph创建柱状图展示年度收支表效果示例
2017/02/15 PHP
js中巧用cssText属性批量操作样式
2011/03/13 Javascript
js内置对象 学习笔记
2011/08/01 Javascript
Javascript中浮点数相乘的一个解决方法
2014/06/03 Javascript
js创建数组的简单方法
2016/07/27 Javascript
jQuery对checkbox 复选框的全选全不选反选的操作
2016/08/09 Javascript
Nodejs--post的公式详解
2017/04/29 NodeJs
nodejs项目windows下开机自启动的方法
2017/11/22 NodeJs
angularjs实现对表单输入改变的监控(ng-change和watch两种方式)
2018/08/29 Javascript
Vue项目中使用better-scroll实现一个轮播图自动播放功能
2018/12/03 Javascript
layui默认选中table的CheckBox复选框方法
2019/09/19 Javascript
[02:50]【扭转乾坤,只此一招】DOTA2永雾林渊版本开启新篇章
2020/12/22 DOTA
pyside写ui界面入门示例
2014/01/22 Python
在Python中定义和使用抽象类的方法
2016/06/30 Python
Python实现字符串的逆序 C++字符串逆序算法
2020/05/28 Python
使用pandas read_table读取csv文件的方法
2018/07/04 Python
浅谈django 模型类使用save()方法的好处与注意事项
2020/03/28 Python
python爬虫中PhantomJS加载页面的实例方法
2020/11/12 Python
python爬虫爬取某网站视频的示例代码
2021/02/20 Python
HTML5 Canvas API中drawImage()方法的使用实例
2016/03/25 HTML / CSS
俄罗斯最大的隐形眼镜销售网站:Ochkov.Net
2021/02/07 全球购物
颇特女士香港官网:NET-A-PORTER香港
2021/03/08 全球购物
国家助学金获奖感言
2014/01/31 职场文书
学雷锋宣传标语
2014/06/25 职场文书
机电一体化专业求职信
2014/07/22 职场文书
写给医院的感谢信
2015/01/22 职场文书
2015年党风建设工作总结
2015/04/29 职场文书
2016年社会管理综治宣传月活动总结
2016/03/16 职场文书
2019思想汇报范文
2019/05/21 职场文书
nginx+lua单机上万并发的实现
2021/05/31 Servers
一次SQL如何查重及去重的实战记录
2022/03/13 MySQL