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 相关文章推荐
javascript 可以拖动的DIV(二)
Jun 26 Javascript
jQuery.Autocomplete实现自动完成功能(详解)
Jul 13 Javascript
使用jquery自定义鼠标样式满足个性需求
Nov 05 Javascript
jQuery实现跨域
Feb 03 Javascript
javascript判断并获取注册表中可信任站点的方法
Jun 01 Javascript
JS+CSS实现六级网站导航主菜单效果
Sep 28 Javascript
JavaScript对象参数的引用传递
Jan 14 Javascript
Angular.js与Bootstrap相结合实现表格分页代码
Apr 12 Javascript
AngularJS实现表格的增删改查(仅限前端)
Jul 04 Javascript
微信小程序6位或多位验证码密码输入框功能的实现代码
May 29 Javascript
优雅的处理vue项目异常实战记录
Jun 05 Javascript
Javascript实现秒表计时游戏
May 27 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 URL验证正则表达式
2011/07/19 PHP
迅速确定php多维数组的深度的方法
2014/01/07 PHP
codeigniter框架批量插入数据
2014/01/09 PHP
PHP exif扩展方法开启详解
2014/07/28 PHP
php微信公众号开发(2)百度BAE搭建和数据库使用
2016/12/15 PHP
简单的无缝滚动程序-仅几行代码
2007/05/08 Javascript
麦鸡的TAB切换功能结合了javascript和css
2007/12/17 Javascript
javascript 时间比较实现代码
2009/10/28 Javascript
JS运行耗时操作的延时显示方法
2010/11/19 Javascript
一个简单的Node.js异步操作管理器分享
2014/04/29 Javascript
jquery实现在页面加载的时自动为日期插件添加当前日期
2014/08/20 Javascript
浅谈javascript中自定义模版
2015/01/29 Javascript
jQuery往返城市和日期查询实例讲解
2015/10/09 Javascript
深入理解jQuery之防止冒泡事件
2016/05/24 Javascript
webpack+vue.js实现组件化详解
2016/10/12 Javascript
js中toString()和String()区别详解
2017/03/23 Javascript
jquery+css实现侧边导航栏效果
2017/06/12 jQuery
jQuery EasyUI结合zTree树形结构制作web页面
2017/09/01 jQuery
Python的SQLAlchemy框架使用入门
2015/04/29 Python
Python安装官方whl包和tar.gz包的方法(推荐)
2017/06/04 Python
python的pip安装以及使用教程
2018/09/18 Python
对python中的 os.mkdir和os.mkdirs详解
2018/10/16 Python
Django框架 Pagination分页实现代码实例
2019/09/04 Python
pandas实现将日期转换成timestamp
2019/12/07 Python
CSS3中新增的对文本和字体的设置
2020/02/03 HTML / CSS
巴黎欧莱雅法国官网:L’Oreal Paris
2019/04/30 全球购物
Conforama瑞士:家具、厨房、电器、装饰
2020/09/06 全球购物
随机分配座位,共50个学生,使学号相邻的同学座位不能相邻
2014/01/18 面试题
体育教师工作总结的自我评价
2013/10/10 职场文书
优秀士兵个人事迹材料
2014/01/19 职场文书
幼儿园迎国庆65周年活动策划方案
2014/09/16 职场文书
交通事故被告答辩状
2015/05/22 职场文书
pygame面向对象的飞行小鸟实现(Flappy bird)
2021/04/01 Python
CSS极坐标的实例代码
2021/06/03 HTML / CSS
《英雄联盟》2022日蚀、月蚀皮肤演示 黑潮亚索曝光
2022/04/13 其他游戏
解决vue中provide inject的响应式监听
2022/04/19 Vue.js