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 TextArea字符串长度限制代码集合
Oct 31 Javascript
javascript 获取模态窗口的滚动位置代码
Aug 06 Javascript
jquery防止重复执行动画避免页面混乱
Apr 22 Javascript
JQuery实现当鼠标停留在某区域3秒后自动执行
Sep 09 Javascript
自定义Angular指令与jQuery实现的Bootstrap风格数据双向绑定的单选与多选下拉框
Dec 12 Javascript
jquery判断checkbox是否选中及改变checkbox状态的实现方法
May 26 Javascript
Jquery基础之事件操作详解
Jun 14 Javascript
浅谈js中对象的使用
Aug 11 Javascript
Es6 写的文件import 起来解决方案详解
Dec 13 Javascript
详解让sublime text3支持Vue语法高亮显示的示例
Sep 29 Javascript
详细分析JS函数去抖和节流
Dec 05 Javascript
vue实现自定义多选按钮
Jul 16 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
使用eAccelerator加密PHP程序
2008/10/03 PHP
PHP小白必须要知道的php基础知识(超实用)
2017/10/10 PHP
php单元测试phpunit入门实例教程
2017/11/17 PHP
$()JS小技巧
2007/07/21 Javascript
jQuery 使用手册(一)
2009/09/23 Javascript
分享XmlHttpRequest调用Webservice的一点心得
2012/07/20 Javascript
JS实现slide文字框缩放伸展效果代码
2015/11/05 Javascript
jQuery 特性操作详解及实例代码
2016/09/29 Javascript
Angular2学习笔记——详解NgModule模块
2016/12/02 Javascript
Vue.js上下滚动加载组件的实例代码
2017/07/17 Javascript
JS对象序列化成json数据和json数据转化为JS对象的代码
2017/08/23 Javascript
基于JavaScript实现报警器提示音效果
2017/10/27 Javascript
cordova入门基础教程及使用中遇到的一些问题总结
2017/11/14 Javascript
webpack的CSS加载器的使用
2018/09/11 Javascript
从Vuex中取出数组赋值给新的数组,新数组push时报错的解决方法
2018/09/18 Javascript
微信小程序实现的picker多级联动功能示例
2019/05/23 Javascript
layui checkbox默认选中,获取选中值,清空所有选中项的例子
2019/09/02 Javascript
JS数组Reduce方法功能与用法实例详解
2020/04/29 Javascript
Javascript基于OOP实实现探测器功能代码实例
2020/08/26 Javascript
[01:52]2014DOTA2西雅图邀请赛 V社开大会你不知道的小秘密
2014/07/08 DOTA
[01:06] DOTA2英雄背景故事第三期之秩序法则光之守卫
2020/07/07 DOTA
python爬虫入门教程--快速理解HTTP协议(一)
2017/05/25 Python
Python使用装饰器模拟用户登陆验证功能示例
2018/08/24 Python
Python功能点实现:函数级/代码块级计时器
2019/01/02 Python
Python 处理图片像素点的实例
2019/01/08 Python
python应用文件读取与登录注册功能
2019/09/23 Python
python GUI库图形界面开发之PyQt5浏览器控件QWebEngineView详细使用方法
2020/02/26 Python
python pymysql库的常用操作
2020/10/16 Python
CSS3教程:边框属性border的极致应用
2009/04/02 HTML / CSS
印度尼西亚手表和包包商店:Urban Icon
2019/12/12 全球购物
如何将整数int转换成字串String
2014/03/21 面试题
详解如何解决使用JSON.stringify时遇到的循环引用问题
2021/03/23 Javascript
工程造价专业大学生自荐信
2013/10/01 职场文书
工程监理应届生求职信
2013/11/09 职场文书
加多宝凉茶广告词
2014/03/18 职场文书
2014年党委工作总结
2014/11/22 职场文书