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 相关文章推荐
javascript采用数组实现tab菜单切换效果
Dec 12 Javascript
Javascript 鼠标移动上去小三角形滑块缓慢跟随效果
Apr 26 Javascript
JS中getYear()和getFullYear()区别分析
Jul 04 Javascript
jquery easyui使用心得
Jul 07 Javascript
jquery分隔Url的param方法(推荐)
May 25 Javascript
跨域请求的完美解决方法(JSONP, CORS)
Jun 12 Javascript
JS 实现Base64编码与解码实例详解
Nov 07 Javascript
AngularJs 延时器、计时器实例代码
Sep 16 Javascript
layer关闭当前窗口页面以及确认取消按钮的方法
Sep 09 Javascript
vue项目配置同一局域网可使用ip访问的操作
Oct 23 Javascript
Vue实现简单购物车功能
Dec 13 Vue.js
测量JavaScript函数的性能各种方式对比
Apr 27 Javascript
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
php利用新浪接口查询ip获取地理位置示例
2014/01/20 PHP
CodeIgniter框架提示Disallowed Key Characters的解决办法
2014/04/21 PHP
php实现的单一入口应用程序实例分析
2015/09/23 PHP
php简单实现多维数组排序的方法
2016/09/30 PHP
thinkPHP实现多字段模糊匹配查询的方法
2016/12/01 PHP
PHP面向对象程序设计之对象克隆clone和魔术方法__clone()用法分析
2019/06/12 PHP
javascript网页关键字高亮代码
2008/07/30 Javascript
js下用层来实现select的title提示属性
2010/02/23 Javascript
js调用webservice中的方法实现思路及代码
2013/02/25 Javascript
基于jquery实现日历签到功能
2020/09/11 Javascript
jQuery插件Flexslider实现图片轮播、图文结合滑动切换效果
2020/04/16 Javascript
H5移动端图片压缩上传开发流程
2016/11/09 Javascript
微信小程序访问node.js接口服务器搭建教程
2017/04/25 Javascript
react 组件传值的三种方法
2019/06/03 Javascript
Vue项目中Api的组织和返回数据处理的操作
2019/11/04 Javascript
js实现九宫格抽奖
2020/03/19 Javascript
vue+element UI实现树形表格
2020/12/29 Vue.js
详解Python中的条件判断语句
2015/05/14 Python
Python类的用法实例浅析
2015/05/27 Python
python 统计数组中元素出现次数并进行排序的实例
2018/07/02 Python
python实现浪漫的烟花秀
2019/01/30 Python
TensorFlow2.0:张量的合并与分割实例
2020/01/19 Python
用python 绘制茎叶图和复合饼图
2021/02/26 Python
HTML5本地存储之Web Storage详解
2016/07/04 HTML / CSS
土耳其家居建材网站:Koçtaş
2016/11/22 全球购物
John Varvatos官方网站:设计师男士时装
2017/02/08 全球购物
十佳大学生事迹材料
2014/01/29 职场文书
大学校园活动策划书
2014/02/04 职场文书
十佳文明家庭事迹
2014/05/25 职场文书
群众路线四风自我剖析材料
2014/10/08 职场文书
服务员态度差检讨书
2014/10/28 职场文书
升职自我推荐信范文
2015/03/25 职场文书
安全事故隐患排查治理制度
2015/08/05 职场文书
导游词之长城八达岭
2019/09/24 职场文书
聊一聊Redis与MySQL双写一致性如何保证
2021/06/26 Redis
MySQL生成千万测试数据以及遇到的问题
2022/08/05 MySQL