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 checkbox(复选框) 使用集锦
Apr 28 Javascript
仿中关村在线首页弹出式广告插件(jQuery版)
May 03 Javascript
jQuery给动态添加的元素绑定事件的方法
Mar 09 Javascript
js实现固定显示区域内自动缩放图片的方法
Jul 18 Javascript
JavaScript通过HTML的class来获取HTML元素的方法总结
May 24 Javascript
微信小程序实现登录页云层漂浮的动画效果
May 05 Javascript
微信小程序实现签到功能
Oct 31 Javascript
一个Java程序猿眼中的前后端分离以及Vue.js入门(推荐)
Apr 19 Javascript
对layui中的onevent 和event的使用详解
Sep 06 Javascript
Vue学习之axios的使用方法实例分析
Jan 06 Javascript
JS造成内存泄漏的几种情况实例分析
Mar 02 Javascript
详解Howler.js Web音频播放终极解决方案
Aug 23 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
第十二节--类的自动加载
2006/11/16 PHP
Eclipse的PHP插件PHPEclipse安装和使用
2014/07/20 PHP
php+xml实现在线英文词典查询的方法
2015/01/23 PHP
浅谈Yii乐观锁的使用及原理
2017/07/25 PHP
PHP使用Redis长连接的方法详解
2018/02/12 PHP
php 调用百度sms来发送短信的实现示例
2018/11/02 PHP
jquery+json 通用三级联动下拉列表
2010/04/19 Javascript
跨浏览器开发经验总结(四) 怎么写入剪贴板
2010/05/13 Javascript
数组方法解决JS字符串连接性能问题有争议
2011/01/12 Javascript
js的[defer]和[async]属性
2014/11/24 Javascript
JS实现判断滚动条滚到页面底部并执行事件的方法
2014/12/18 Javascript
JavaScript中的eval()函数使用介绍
2014/12/31 Javascript
jQuery+PHP+MySQL实现无限级联下拉框效果
2016/02/19 Javascript
js实现砖头在页面拖拉效果
2020/11/20 Javascript
jQuery+ajax的资源回收处理机制分析
2017/01/07 Javascript
利用vue和element-ui设置表格内容分页的实例
2018/03/02 Javascript
axios发送post请求,提交图片类型表单数据方法
2018/03/16 Javascript
深入理解JavaScript 中的执行上下文和执行栈
2018/10/23 Javascript
ES6学习笔记之字符串、数组、对象、函数新增知识点实例分析
2020/01/22 Javascript
详解React中共享组件逻辑的三种方式
2021/02/02 Javascript
编写Python小程序来统计测试脚本的关键字
2016/03/12 Python
python脚本监控Tomcat服务器的方法
2018/07/06 Python
十行代码使用Python写一个USB病毒
2019/06/21 Python
Python中pymysql 模块的使用详解
2019/08/12 Python
Python实现一个简单的递归下降分析器
2020/08/01 Python
python 实现百度网盘非会员上传超过500个文件的方法
2021/01/07 Python
欧尚俄罗斯网上超市:Auchan俄罗斯
2018/05/03 全球购物
Nº21官方在线商店:numeroventuno.com
2019/09/26 全球购物
软件测试笔试题
2012/10/25 面试题
防灾减灾活动总结
2014/08/30 职场文书
乡镇组织委员个人整改措施
2014/09/16 职场文书
离婚被告代理词
2015/05/23 职场文书
幼儿园大班开学寄语(2016秋季)
2015/12/03 职场文书
英文诗歌翻译方法(赏析)
2019/08/16 职场文书
500字作文之难忘的同学
2019/12/20 职场文书
Java数据结构之链表相关知识总结
2021/06/18 Java/Android