jQuery中:selected选择器用法实例


Posted in Javascript onJanuary 04, 2015

本文实例讲述了jQuery中:selected选择器用法。分享给大家供大家参考。具体分析如下:

此选择器能够匹配被选择的<option>元素。

语法结构:

$(":selected")

此选择器可以和其他选择器配合使用,比如类选择器、元素选择器等等。例如:
$(".myselect :selected").css("color","red")

以上代码能够将类名为myselect的元素下被选择的<option>元素中的文本颜色设置为红色。大家一定要注意上面的代码,两个选择器之间是用空格分隔的,这个时候是后代选择器, 如果没有空格的话那就成了复合属性选择器,代码的意思也就变为将类名为myselect并且被选择的<option>元素中的字体颜色设置为红色。

实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.com/" />

<title>三水点靠木</title>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript"> 

$(document).ready(function(){ 

  $(".myselect :selected").css("color","red") 

}); 

</script>

</head>

<body>

<ul>

  <li>

    <select name="myselect" class="myselect">

      <option>html专区</option>

      <option>ASP专区</option>

      <option selected="selected">JQuery专区</option>

    </select>

  </li>

</ul>

</body>

</html>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
利用jQuery的$.event.fix函数统一浏览器event事件处理
Dec 21 Javascript
jquery validate添加自定义验证规则(验证邮箱 邮政编码)
Dec 04 Javascript
js兼容火狐显示上传图片预览效果的方法
May 21 Javascript
AngularJS ngModel实现指令与输入直接的数据通信
Sep 21 Javascript
深入理解选择框脚本[推荐]
Dec 13 Javascript
AngularJS页面带参跳转及参数解析操作示例
Jun 28 Javascript
Windows下Node.js安装及环境配置方法
Sep 18 Javascript
vue-cli 自定义指令directive 添加验证滑块示例
Oct 19 Javascript
JavaScript实现QQ列表展开收缩扩展功能
Oct 30 Javascript
Nuxt页面级缓存的实现
Mar 09 Javascript
vue+element ui实现锚点定位
Jun 29 Vue.js
Vue h函数的使用详解
Feb 18 Vue.js
jQuery中:checked选择器用法实例
Jan 04 #Javascript
jQuery中:disabled选择器用法实例
Jan 04 #Javascript
AngularJS中取消对HTML片段转义的方法例子
Jan 04 #Javascript
jQuery中:enabled选择器用法实例
Jan 04 #Javascript
jQuery中:file选择器用法实例
Jan 04 #Javascript
jQuery中:button选择器用法实例
Jan 04 #Javascript
原生javascript实现隔行换色
Jan 04 #Javascript
You might like
咖啡与牛奶
2021/03/03 冲泡冲煮
使用sockets:从新闻组中获取文章(二)
2006/10/09 PHP
MayFish PHP的MVC架构的开发框架
2009/08/13 PHP
使用xampp搭建运行php虚拟主机的详细步骤
2015/10/21 PHP
php生成二维码图片方法汇总
2016/12/17 PHP
php实现单笔转账到支付宝功能
2018/10/09 PHP
JavaScript事件处理器中的event参数使用介绍
2013/05/24 Javascript
在javaScript中关于submit和button的区别介绍
2013/10/20 Javascript
非常漂亮的JS+CSS图片幻灯切换特效
2013/11/20 Javascript
Node.js实现在目录中查找某个字符串及所在文件
2014/09/03 Javascript
node.js中的fs.truncate方法使用说明
2014/12/15 Javascript
javascript白色简洁计算器
2015/05/04 Javascript
Vue.js每天必学之指令系统与自定义指令
2016/09/07 Javascript
AngularJS实现星星等级评分功能
2016/09/24 Javascript
JQuery validate 验证一个单独的表单元素实例
2017/02/17 Javascript
NodeJs下的测试框架Mocha的简单介绍
2017/02/22 NodeJs
JS实现线性表的链式表示方法示例【经典数据结构】
2017/04/11 Javascript
jquery仿京东商品放大浏览页面
2017/06/06 jQuery
node中Express 动态设置端口的方法
2017/08/04 Javascript
jquery tmpl模板(实例讲解)
2017/09/02 jQuery
基于wordpress的ajax写法详解
2018/01/02 Javascript
详解如何在nuxt中添加proxyTable代理
2018/08/10 Javascript
js类的继承定义与用法分析
2019/06/21 Javascript
仅用50行Python代码实现一个简单的代理服务器
2015/04/08 Python
Python中一些不为人知的基础技巧总结
2018/05/19 Python
python实现windows下文件备份脚本
2018/05/27 Python
美国第二大连锁药店:Rite Aid
2019/04/03 全球购物
瑞士首家网上药店折扣店:McDrogerie
2020/12/22 全球购物
某/etc/fstab文件中的某行如下: /dev/had5 /mnt/dosdata msdos defaults,usrquota 1 2 请解释其含义
2013/09/18 面试题
2014新年寄语
2014/01/20 职场文书
安全大检查实施方案
2014/02/22 职场文书
施工单位安全责任书
2014/07/24 职场文书
Sleuth+logback 设置traceid 及自定义信息方式
2021/07/26 Java/Android
Redis RDB技术底层原理详解
2021/09/04 Redis
HTML中的表格元素介绍
2022/02/28 HTML / CSS
postgreSQL数据库基础知识介绍
2022/04/12 PostgreSQL