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 相关文章推荐
js对象关系图 方便dom操作
Mar 18 Javascript
javascript 回到顶部效果的实现代码
Feb 17 Javascript
jquery实现背景墙聚光灯效果示例分享
Mar 02 Javascript
ExpressJS入门实例
Jan 14 Javascript
在JavaScript中操作时间之getMonth()方法的使用
Jun 10 Javascript
原生js实现网易轮播图效果
Apr 10 Javascript
webuploader模态框ueditor显示问题解决方法
Dec 27 Javascript
Bootstrap Multiselect 常用组件实现代码
Jul 09 Javascript
vue刷新页面时去闪烁提升用户体验效果的实现方法
Dec 10 Javascript
Promise扫盲贴
Jun 24 Javascript
JavaScript利用html5新方法操作元素类名详解
Nov 27 Javascript
vue router 动态路由清除方式
May 25 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
php中如何使对象可以像数组一样进行foreach循环
2013/08/09 PHP
使用户点击后退按钮使效三行代码
2007/07/07 Javascript
url 编码 js url传参中文乱码解决方案
2010/04/11 Javascript
JS DOM 操作实现代码
2010/08/01 Javascript
javascript alert乱码的解决方法
2013/11/05 Javascript
js获取下拉列表框中的value和text的值示例代码
2014/01/11 Javascript
提取jquery的ready()方法单独使用示例
2014/03/25 Javascript
JS实现关键字搜索时的相关下拉字段效果
2014/08/05 Javascript
JavaScript返回当前会话cookie全部键值对照的方法
2015/04/03 Javascript
基于JavaScript如何制作遮罩层对话框
2016/01/26 Javascript
jQuery简单实现提交数据出现loading进度条的方法
2016/03/29 Javascript
前端框架Vue.js中Directive知识详解
2016/09/12 Javascript
获取jqGrid中选择的行的数据
2016/11/30 Javascript
Angular2自定义分页组件
2017/04/19 Javascript
nodejs动态创建二维码的方法
2017/08/12 NodeJs
nodejs中密码加密处理操作详解
2018/03/20 NodeJs
微信小程序实现折叠与展开文章功能
2018/06/12 Javascript
React Native开发封装Toast与加载Loading组件示例
2018/09/08 Javascript
JavaScript简单实现动态改变HTML内容的方法示例
2018/12/25 Javascript
js+canvas实现刮刮奖功能
2020/09/13 Javascript
如何将Node.js中的回调转换为Promise
2020/11/10 Javascript
[02:04]2014DOTA2国际邀请赛 DK一个时代的落幕
2014/07/21 DOTA
零基础写python爬虫之爬虫编写全记录
2014/11/06 Python
Django自定义插件实现网站登录验证码功能
2017/04/19 Python
Python使用正则表达式获取网页中所需要的信息
2018/01/29 Python
windows、linux下打包Python3程序详细方法
2020/03/17 Python
Python eval函数原理及用法解析
2020/11/14 Python
python实现定时发送邮件
2020/12/23 Python
Spongelle官网:美国的创意护肤洗护品牌
2019/05/15 全球购物
纽约市的奢华内衣目的地:Anya Lust
2019/08/02 全球购物
Conforama瑞士:家具、厨房、电器、装饰
2020/09/06 全球购物
中学生在校期间的自我评价分享
2013/11/13 职场文书
《充气雨衣》教学反思
2014/04/07 职场文书
小学生综合素质评语
2014/04/23 职场文书
2015年度团总支工作总结
2015/04/23 职场文书
家装电话营销开场白
2015/05/29 职场文书