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 相关文章推荐
jquery 插件学习(二)
Aug 06 Javascript
利用javascript数组长度循环数组内所有元素
Dec 27 Javascript
用js控制组织结构图可以任意拖拽到指定位置
Jan 17 Javascript
jQuery对val和atrr("value")赋值的区别介绍
Sep 26 Javascript
jQuery控制网页打印指定区域的方法
Apr 07 Javascript
Jquery插件之Fancybox丰富的弹出层效果附源码下载
Dec 02 Javascript
jQuery事件对象的属性和方法详解
Sep 09 jQuery
js断点调试心得分享(必看篇)
Dec 08 Javascript
JS隐藏号码中间4位代码实例
Apr 09 Javascript
使用webpack编译es6代码的方法步骤
Apr 28 Javascript
如何获取vue单文件自身源码路径
May 06 Javascript
Postman无法正常返回结果问题解决
Aug 28 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
php侧拉菜单 漂亮,可以向右或者向左展开,支持FF,IE
2009/10/15 PHP
PHP中mysql_field_type()函数用法
2014/11/24 PHP
jQuery学习2 选择器的使用说明
2010/02/07 Javascript
javascript+mapbar实现地图定位
2010/04/09 Javascript
JavaScript学习历程和心得小结
2010/08/16 Javascript
js实现按钮控制图片360度翻转特效的方法
2015/02/17 Javascript
javascript实现控制文字大中小显示
2015/04/28 Javascript
jQuery+ajax实现滚动到页面底部自动加载图文列表效果(类似图片懒加载)
2016/06/07 Javascript
jQuery选择器之子元素过滤选择器
2017/09/28 jQuery
微信小程序上传图片到服务器实例代码
2017/11/07 Javascript
vue项目优化之通过keep-alive数据缓存的方法
2017/12/11 Javascript
总结js中的一些兼容性易错的问题
2017/12/18 Javascript
JS中利用FileReader实现上传图片前本地预览功能
2018/03/02 Javascript
node.js +mongdb实现登录功能
2020/06/18 Javascript
vue Treeselect 树形下拉框:获取选中节点的ids和lables操作
2020/08/15 Javascript
详解tensorflow载入数据的三种方式
2018/04/24 Python
python 检查是否为中文字符串的方法
2018/12/28 Python
在Mac中配置Python虚拟环境过程解析
2020/06/22 Python
python获得命令行输入的参数的两种方式
2020/11/02 Python
澳大利亚个性化儿童礼品网站:Bright Star Kids
2019/06/14 全球购物
介绍一下UNIX启动过程
2013/11/14 面试题
女大学生个人求职信
2013/12/09 职场文书
高一自我鉴定
2013/12/17 职场文书
运动会通讯稿50字
2014/01/30 职场文书
2014年五一活动策划方案
2014/03/15 职场文书
授权委托书范文
2014/07/31 职场文书
领导四风问题整改措施思想汇报
2014/10/13 职场文书
《爱的教育》读书心得
2014/11/08 职场文书
2014年妇女工作总结
2014/12/06 职场文书
校长师德表现自我评价
2015/03/05 职场文书
婚礼家长致辞
2015/07/27 职场文书
师德培训心得体会2016
2016/01/09 职场文书
《中国古代诗歌散文欣赏》高中语文教材
2019/08/20 职场文书
Python 实现定积分与二重定积分的操作
2021/05/26 Python
《乙女游戏世界对路人角色很不友好》OP主题曲无字幕动画MV公开
2022/04/05 日漫
使用CSS自定义属性实现骨架屏效果
2022/06/21 HTML / CSS