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 相关文章推荐
javascript针对DOM的应用实例(一)
Apr 15 Javascript
疯狂Jquery第一天(Jquery学习笔记)
May 11 Javascript
js实现文本框中输入文字页面中div层同步获取文本框内容的方法
Mar 03 Javascript
JavaScript中this的9种应用场景及三种复合应用场景
Sep 12 Javascript
jQuery Validation Plugin验证插件手动验证
Jan 26 Javascript
jQuery toggle 代替方法
Mar 22 Javascript
javascript实现的左右无缝滚动效果
Sep 19 Javascript
基于JS快速实现导航下拉菜单动画效果附源码下载
Oct 27 Javascript
纯JS实现弹性导航条效果
Mar 06 Javascript
jquery图片放大镜效果
Jun 23 jQuery
node 利用进程通信实现Cluster共享内存
Oct 27 Javascript
validform表单验证的实现方法
Mar 08 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
Javascript与PHP验证用户输入URL地址是否正确
2014/10/09 PHP
PHP上传Excel文件导入数据到MySQL数据库示例
2016/10/25 PHP
Nigma vs Alliance BO5 第四场2.14
2021/03/10 DOTA
JS打开新窗口的2种方式
2013/04/18 Javascript
c#+jquery实现获取radio和checkbox的值
2020/09/12 Javascript
Yii2使用Bootbox插件实现自定义弹窗
2015/04/02 Javascript
JavaScript使用指针操作实现约瑟夫问题实例
2015/04/07 Javascript
根据user-agent判断蜘蛛代码黑帽跳转代码(js版与php版本)
2015/09/14 Javascript
基于jQuery日历插件制作日历
2016/03/11 Javascript
JS/jQuery判断DOM节点是否存在的简单方法
2016/11/24 Javascript
详解vue中localStorage的使用方法
2018/11/22 Javascript
vue双向绑定及观察者模式详解
2019/03/19 Javascript
mongodb初始化并使用node.js实现mongodb操作封装方法
2019/04/02 Javascript
使用 Vue cli 3.0 构建自定义组件库的方法
2019/04/30 Javascript
layui监听工具栏的实例(操作列表按钮)
2019/09/10 Javascript
Jquery Datatables的使用详解
2020/01/30 jQuery
antd-mobile ListView长列表的数据更新遇到的坑
2020/04/08 Javascript
微信小程序绘制半圆(弧形)进度条
2020/11/18 Javascript
python内存管理分析
2015/04/08 Python
学习python 之编写简单乘法运算题
2016/02/27 Python
python3+PyQt5实现自定义窗口部件Counters
2018/04/20 Python
Centos下实现安装Python3.6和Python2共存
2018/08/15 Python
python使用pymongo操作mongo的完整步骤
2019/04/13 Python
详解pytorch 0.4.0迁移指南
2019/06/16 Python
Python+redis通过限流保护高并发系统
2020/04/15 Python
pip已经安装好第三方库但pycharm中import时还是标红的解决方案
2020/10/09 Python
python 三种方法提取pdf中的图片
2021/02/07 Python
css实例教程 一款纯css3实现的超炫动画背画特效
2014/11/05 HTML / CSS
前端canvas水印快速制作(附完整代码)
2019/09/19 HTML / CSS
阿根廷在线宠物商店:Puppis
2018/03/23 全球购物
应聘编辑职位自荐信范文
2014/01/05 职场文书
个人租房协议书(范本)
2014/10/14 职场文书
《比的意义》教学反思
2016/02/18 职场文书
十大冰系宝可梦排名,颜值最高的阿罗拉九尾,第三使用率第一
2022/03/18 日漫
深入讲解Vue中父子组件通信与事件触发
2022/03/22 Vue.js