jquery操作select详解(取值,设置选中)


Posted in Javascript onFebruary 07, 2014

每一次操作select的时候,总是要出来翻一下资料,不如自己总结一下,以后就翻这里了。

比如<select class="selector"></select>

1、设置value为pxx的项选中

 $(".selector").val("pxx");

2、设置text为pxx的项选中

$(".selector").find("option[text='pxx']").attr("selected",true);

这里有一个中括号的用法,中括号里的等号的前面是属性名称,不用加引号。很多时候,中括号的运用可以使得逻辑变得很简单。

3、获取当前选中项的value

$(".selector").val();

4、获取当前选中项的text

$(".selector").find("option:selected").text();

这里用到了冒号,掌握它的用法并举一反三也会让代码变得简洁。

很多时候用到select的级联,即第二个select的值随着第一个select选中的值变化。这在jquery中是非常简单的。

如:

$(".selector1").change(function(){
 // 先清空第二个
  $(".selector2").empty();
 // 实际的应用中,这里的option一般都是用循环生成多个了
  var option = $("<option>").val(1).text("pxx");
  $(".selector2").append(option);
});
Javascript 相关文章推荐
js中split函数的使用方法说明
Dec 26 Javascript
30个经典的jQuery代码开发技巧
Dec 15 Javascript
jQuery中prependTo()方法用法实例
Jan 08 Javascript
jQuery实现页面顶部下拉广告
Dec 30 Javascript
Node Puppeteer图像识别实现百度指数爬虫的示例
Feb 22 Javascript
json字符串传到前台input的方法
Aug 06 Javascript
关于node-bindings无法在Electron中使用的解决办法
Dec 18 Javascript
判断“命令按钮”是否被鼠标单击详解
Jul 31 Javascript
Vue.js计算机属性computed和methods方法详解
Oct 12 Javascript
微信小程序实现多行文字滚动
Nov 18 Javascript
vue路由实现登录拦截
Mar 24 Vue.js
Element实现动态表格的示例代码
Aug 02 Javascript
jquery select 设置默认选中的示例代码
Feb 07 #Javascript
jquery 淡入淡出效果的简单实现
Feb 07 #Javascript
通过遮罩层实现浮层DIV登录的js代码
Feb 07 #Javascript
做好七件事帮你提升jQuery的性能
Feb 06 #Javascript
为开发者准备的10款最好的jQuery日历插件
Feb 04 #Javascript
javascript简单性能问题及学习笔记
Feb 04 #Javascript
JavaScript初学者建议:不要去管浏览器兼容
Feb 04 #Javascript
You might like
将PHP从5.3.28升级到5.3.29时Nginx出现502错误
2015/05/09 PHP
Referer原理与图片防盗链实现方法详解
2019/07/03 PHP
让网页根据不同IE版本显示不同的内容
2009/02/08 Javascript
jquery.fileEveryWhere.js 一个跨浏览器的file显示插件
2011/10/24 Javascript
js简易namespace管理器 实例代码
2013/06/21 Javascript
JS处理json日期格式化问题
2015/10/01 Javascript
JavaScript获取function所有参数名的方法
2015/10/30 Javascript
jQuery EasyUI中DataGird动态生成列的方法
2016/04/05 Javascript
Bootstrap table右键功能实现方法
2017/02/20 Javascript
jQuery事件_动力节点Java学院整理
2017/07/05 jQuery
微信小程序实现刷脸登录
2018/05/25 Javascript
Vue父子组建的简单通信之控制开关Switch的实现
2018/06/04 Javascript
Vue CL3 配置路径别名详解
2019/05/30 Javascript
vue中watch和computed的区别与使用方法
2020/08/23 Javascript
vue 获取url里参数的两种方法小结
2020/11/12 Javascript
让python的Cookie.py模块支持冒号做key的方法
2010/12/28 Python
Python3.5.3下配置opencv3.2.0的操作方法
2018/04/02 Python
python获取文件路径、文件名、后缀名的实例
2018/04/23 Python
python实现石头剪刀布小游戏
2021/01/20 Python
Pandas透视表(pivot_table)详解
2019/07/22 Python
Pandas实现DataFrame按行求百分数(比例数)
2019/12/27 Python
Python小白垃圾回收机制入门
2020/06/09 Python
Django Session和Cookie分别实现记住用户登录状态操作
2020/07/02 Python
利用SVG和CSS3来实现一个炫酷的边框动画
2015/07/22 HTML / CSS
Ray-Ban雷朋美国官网:全球领先的太阳眼镜品牌
2016/07/20 全球购物
Yahoo-PHP面试题4
2012/05/05 面试题
如何编写优秀的食品项目创业计划书
2014/01/23 职场文书
财经学院自荐信范文
2014/02/02 职场文书
五型班组建设方案
2014/02/10 职场文书
《蒲公英》教学反思
2014/02/28 职场文书
企业承诺书格式
2014/05/21 职场文书
物业管理专业求职信
2014/06/11 职场文书
学习考察心得体会
2014/09/04 职场文书
领导干部作风建设剖析材料
2014/10/11 职场文书
佛光寺导游词
2015/02/10 职场文书
2015年高三班主任工作总结
2015/05/21 职场文书