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动态在form上插入enctype=multipart/form-data的问题
May 24 Javascript
jquery右下角弹出提示框示例代码
Oct 08 Javascript
运用jQuery定时器的原理实现banner图片切换
Oct 22 Javascript
jquery mobile界面数据刷新的实现方法
May 28 Javascript
input file上传 图片预览功能实例代码
Oct 25 Javascript
详解JavaScript时间处理之几个月前或几个月后的指定日期
Dec 21 Javascript
javascript 实现文本使用省略号替代(超出固定高度的情况)
Feb 21 Javascript
AngularJS 单选框及多选框的双向动态绑定
Apr 20 Javascript
vue-cli3 DllPlugin 提取公用库的方法
Apr 24 Javascript
使用vue脚手架(vue-cli)搭建一个项目详解
May 09 Javascript
10种JavaScript最常见的错误(小结)
Jun 21 Javascript
Vue 技巧之控制父类的 slot
Feb 24 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脚本的10个技巧(3)
2006/10/09 PHP
PHP获取当前页面完整URL的实现代码
2013/06/10 PHP
ThinkPHP令牌验证实例
2014/06/18 PHP
php实现的九九乘法口诀表简洁版
2014/07/28 PHP
PHP简单实现断点续传下载的方法
2015/09/25 PHP
Joomla实现组件中弹出一个模式(modal)窗口的方法
2016/05/04 PHP
浅谈php中的循环while、do...while、for、foreach四种循环
2016/11/05 PHP
Laravel使用PHPQRCODE实现生成带有LOGO的二维码图片功能示例
2017/07/07 PHP
PHP+MySQL实现消息队列的方法分析
2018/05/09 PHP
PHP实现会员账号单唯一登录的方法分析
2019/03/07 PHP
laravel实现上传图片,并且制作缩略图,按照日期存放的代码
2019/10/16 PHP
jQuery插件实现表格隔行换色且感应鼠标高亮行变色
2013/09/22 Javascript
JavaScript在for循环中绑定事件解决事件参数不同的情况
2014/01/20 Javascript
JS制作简单的三级联动
2015/03/18 Javascript
Bootstrap组件系列之福利篇几款好用的组件(推荐)
2016/06/23 Javascript
微信小程序 教程之WXSS
2016/10/18 Javascript
Express与NodeJs创建服务器的两种方法
2017/02/06 NodeJs
Vue2.0仿饿了么webapp单页面应用详细步骤
2018/07/08 Javascript
JavaScript实现简单音乐播放器
2020/04/17 Javascript
vue实现移动端悬浮窗效果
2018/12/01 Javascript
Python ZipFile模块详解
2013/11/01 Python
python实现颜色空间转换程序(Tkinter)
2015/12/31 Python
Python numpy 点数组去重的实例
2018/04/18 Python
python模块smtplib学习
2018/05/22 Python
python3 反射的四种基本方法解析
2019/08/26 Python
python 读取更新中的log 或其它文本方式
2019/12/24 Python
Python @property原理解析和用法实例
2020/02/11 Python
jupyter notebook的安装与使用详解
2020/05/18 Python
python中元组的用法整理
2020/06/15 Python
CSS3实现王者荣耀匹配人员加载页面的方法
2019/04/16 HTML / CSS
企业军训感言
2014/02/08 职场文书
职业培训师职业生涯规划
2014/02/18 职场文书
博士给导师的自荐信
2015/03/06 职场文书
小学音乐课歌曲《堆雪人》教学反思
2016/02/18 职场文书
Python中快速掌握Data Frame的常用操作
2021/03/31 Python
docker compose 部署 golang 的 Athens 私有代理问题
2022/04/28 Servers