Jquery操作下拉框(DropDownList)实现取值赋值


Posted in Javascript onAugust 13, 2013

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("f");

15. 在select前面添加一个option:
$("select#sel").prepend("0");

16. 遍历option:
$(' select#sel option ').each(function (index, domEle) { 
//写入代码 
});
Javascript 相关文章推荐
在js中单选框和复选框获取值的方式
Nov 06 Javascript
js下获取div中的数据的原理分析
Apr 07 Javascript
jquery blockUI 遮罩不能消失与不能提交的解决方法
Sep 17 Javascript
javascript判断并获取注册表中可信任站点的方法
Jun 01 Javascript
Bootstrap基本插件学习笔记之按钮(21)
Dec 08 Javascript
微信小程序 侧滑删除(左滑删除)
May 23 Javascript
关于单文件组件.vue的使用
Sep 20 Javascript
微信小程序模板消息推送的两种实现方式
Aug 27 Javascript
JS运算符简单用法示例
Jan 19 Javascript
原生JS实现留言板功能
Feb 08 Javascript
jQuery实现电梯导航模块
Dec 22 jQuery
canvas实现贪食蛇的实践
Feb 15 Javascript
javascript实现div浮动在网页最顶上并带关闭按钮效果实例
Aug 13 #Javascript
鼠标经过显示二级菜单js特效
Aug 13 #Javascript
Jquery实现搜索框提示功能示例代码
Aug 13 #Javascript
jquery固定底网站底部菜单效果
Aug 13 #Javascript
js 三级关联菜单效果实例
Aug 13 #Javascript
js 单击式的下拉菜单效果实例
Aug 13 #Javascript
让元素在网页中可拖动示例代码
Aug 13 #Javascript
You might like
CodeIgniter模板引擎使用实例
2014/07/15 PHP
Aster vs KG BO3 第二场2.18
2021/03/10 DOTA
jQuery.autocomplete 支持中文输入(firefox)修正方法
2011/03/10 Javascript
script的async属性以非阻塞的模式加载脚本
2013/01/15 Javascript
JavaScript中switch判断容易犯错的一个细节
2014/08/27 Javascript
javascript中Object使用详解
2015/01/26 Javascript
轻松学习jQuery插件EasyUI EasyUI表单验证
2015/12/01 Javascript
Jq通过td获取同行其它列td的方法
2016/10/05 Javascript
轻松理解vue的双向数据绑定问题
2017/10/30 Javascript
Vue使用json-server进行后端数据模拟功能
2018/04/17 Javascript
手把手教你用Node.js爬虫爬取网站数据的方法
2018/07/05 Javascript
vue.js提交按钮时进行简单的if判断表达式详解
2018/08/08 Javascript
vue 使某个组件不被 keep-alive 缓存的方法
2018/09/21 Javascript
详解微信小程序中组件通讯
2018/10/30 Javascript
JointJS流程图的绘制方法
2018/12/03 Javascript
IE浏览器下JS脚本提交表单后,不能自动提示问题解决方法
2019/06/04 Javascript
JavaScript事件委托实现原理及优点进行
2020/08/29 Javascript
python中的列表推导浅析
2014/04/26 Python
Python打印斐波拉契数列实例
2015/07/07 Python
Django发送邮件和itsdangerous模块的配合使用解析
2019/08/10 Python
keras的三种模型实现与区别说明
2020/07/03 Python
用python进行视频剪辑
2020/11/02 Python
详解CSS3的box-shadow属性制作边框阴影效果的方法
2016/05/10 HTML / CSS
有750多个顶级品牌的瑞士时尚在线:ABOUT YOU
2017/01/04 全球购物
La Redoute英国官网:法国时尚品牌
2017/04/27 全球购物
解释一下ruby中的特殊方法与特殊类
2013/02/26 面试题
实习心得体会
2014/01/02 职场文书
教师应聘自荐信范文
2014/03/14 职场文书
自我鉴定总结
2014/03/24 职场文书
商场主管竞聘书
2014/03/31 职场文书
社会稳定风险评估方案
2014/06/02 职场文书
保卫钓鱼岛口号
2014/06/20 职场文书
交通局领导班子群众路线教育实践活动对照检查材料思想汇报
2014/10/09 职场文书
2015年上半年信访工作总结
2015/03/30 职场文书
企业宣传稿范文
2015/07/23 职场文书
创业计划书之农家乐
2019/10/09 职场文书