jquery控制select的text/value值为选中状态


Posted in Javascript onJune 03, 2014

每一次操作select的时候,总是要在网上翻下,太繁琐了,自己在这里总结下。

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

1、设置value为“全部“的项选中

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

2、设置text为“全部“的项选中
$(".selector").find("option[text='全部']").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中的log对象获取以及debug的写法介绍
Mar 03 Javascript
纯js实现div内图片自适应大小(已测试,兼容火狐)
Jun 16 Javascript
jquery 中ajax执行的优先级
Jun 22 Javascript
jquery获取url参数及url加参数的方法
Oct 26 Javascript
Node.js环境下编写爬虫爬取维基百科内容的实例分享
Jun 12 Javascript
详解使用grunt完成requirejs的合并压缩和js文件的版本控制
Mar 02 Javascript
JavaScript实现自动跳转文本功能
May 25 Javascript
基于js原生和ajax的get和post方法以及jsonp的原生写法实例
Oct 16 Javascript
DatePickerDialog 自定义样式及使用全解
Jul 09 Javascript
JS如何实现动态添加的元素绑定事件
Nov 12 Javascript
vue实现移动端图片上传功能
Dec 23 Javascript
JS对象属性的检测与获取操作实例分析
Mar 17 Javascript
Javascript中浮点数相乘的一个解决方法
Jun 03 #Javascript
js下将阿拉伯数字每三位一逗号分隔(如:15000000转化为15,000,000)
Jun 02 #Javascript
js判断当前浏览器类型,判断IE浏览器方法
Jun 02 #Javascript
php+js实现倒计时功能
Jun 02 #Javascript
node.js应用后台守护进程管理器Forever安装和使用实例
Jun 01 #Javascript
node.js入门教程
Jun 01 #Javascript
什么是Node.js?Node.js详细介绍
Jun 01 #Javascript
You might like
php的access操作类
2008/04/09 PHP
PHP系统命令函数使用分析
2013/07/05 PHP
thinkPHP多域名情况下使用memcache方式共享session数据的实现方法
2016/07/21 PHP
基于Web标准的UI组件 — 树状菜单(2)
2006/09/18 Javascript
javascript mouseover、mouseout停止事件冒泡的解决方案
2009/04/07 Javascript
js prototype截取字符串函数
2010/04/01 Javascript
jQuery 1.9.1源码分析系列(十)事件系统之绑定事件
2015/11/19 Javascript
Javascript复制实例详解
2016/01/28 Javascript
JavaScript数组操作函数汇总
2016/08/05 Javascript
Bootstrap下拉菜单样式
2017/02/07 Javascript
分享Bootstrap简单表格、表单、登录页面
2017/08/04 Javascript
jsTree事件和交互以及插件plugins详解
2017/08/29 Javascript
解决Jquery下拉框数据动态获取的问题
2018/01/25 jQuery
vue.js 实现评价五角星组件的实例代码
2018/08/13 Javascript
vue src动态加载请求获取图片的方法
2018/10/17 Javascript
微信小程序顶部导航栏可滑动并选中放大
2019/12/05 Javascript
js实现倒计时秒杀效果
2020/03/25 Javascript
微信小程序实现多选框全选与反全选及购物车中删除选中的商品功能
2019/12/17 Javascript
Python中atexit模块的基本使用示例
2015/07/08 Python
Python使用遗传算法解决最大流问题
2018/01/29 Python
Python处理中文标点符号大集合
2018/05/14 Python
Python2.7环境Flask框架安装简明教程【已测试】
2018/07/13 Python
Python Selenium模块安装使用教程详解
2020/07/09 Python
CSS3之2D与3D变换的实现方法
2019/01/28 HTML / CSS
入党申请书自我鉴定
2013/10/12 职场文书
教师队伍管理制度
2014/01/14 职场文书
村官学习十八大感想
2014/01/15 职场文书
名企HR怎样看待求职信
2014/02/23 职场文书
技术比武方案
2014/05/19 职场文书
公司踏青活动方案
2014/08/16 职场文书
教师学习群众路线心得体会
2014/11/04 职场文书
学生会任命书范本
2015/09/21 职场文书
golang import自定义包方式
2021/04/29 Golang
如何在pycharm中快捷安装pip命令(如pygame)
2021/05/31 Python
SQL Server实现分页方法介绍
2022/03/16 SQL Server
基于Python实现射击小游戏的制作
2022/04/06 Python