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插件开发全解析
Oct 10 Javascript
jquery判断元素是否隐藏的多种方法
May 06 Javascript
js面向对象编程之如何实现方法重载
Jul 02 Javascript
js判断滚动条是否已到页面最底部或顶部实例
Nov 20 Javascript
javascript 利用arguments实现可变长参数
Nov 21 Javascript
Vue.js路由组件vue-router使用方法详解
Dec 02 Javascript
详解Webpack DLL用法以及功能
Jul 11 Javascript
Vue 重置组件到初始状态的方法示例
Oct 10 Javascript
js中console在一行内打印字符串和对象的方法
Sep 10 Javascript
layui table复选框禁止某几条勾选的实例
Sep 20 Javascript
javascript实现鼠标点击生成文字特效
Dec 24 Javascript
JavaScript如何利用Promise控制并发请求个数
May 14 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时间不正确的解决方法
2008/04/09 PHP
PHP时间格式控制符对照表分享
2013/07/23 PHP
php 批量添加多行文本框textarea一行一个
2014/06/03 PHP
PHP递归删除多维数组中的某个值
2017/04/17 PHP
laravel利用中间件防止未登录用户直接访问后台的方法
2019/09/30 PHP
JQuery里面的几种选择器 查找满足条件的元素$(&quot;#控件ID&quot;)
2011/08/23 Javascript
让alert不出现弹窗的两种方法
2014/05/18 Javascript
jquery简单实现网页层的展开与收缩效果
2015/08/07 Javascript
Angularjs 滚动加载更多数据
2016/03/17 Javascript
JS实现左右无缝轮播图代码
2016/05/01 Javascript
JavaScript 节流函数 Throttle 详解
2016/07/04 Javascript
Bootstrap的Carousel配合dropload.js实现移动端滑动切换图片
2017/03/10 Javascript
jQuery插件HighCharts实现的2D堆条状图效果示例【附demo源码下载】
2017/03/14 Javascript
vue.js中引入vuex储存接口数据及调用的详细流程
2017/12/14 Javascript
微信小程序基于本地缓存实现点赞功能的方法
2017/12/18 Javascript
js动态引入的四种方法
2018/05/05 Javascript
关于在LayUI中使用AJAX提交巨坑记录
2019/10/25 Javascript
从表单校验看JavaScript策略模式的使用详解
2020/10/17 Javascript
用Javascript实现发送短信验证码间隔功能
2021/02/08 Javascript
python 不关闭控制台的实现方法
2011/10/23 Python
python中函数总结之装饰器闭包详解
2016/06/12 Python
利用python程序帮大家清理windows垃圾
2017/01/15 Python
Python内存读写操作示例
2018/07/18 Python
对python产生随机的二维数组实例详解
2018/12/13 Python
python Dijkstra算法实现最短路径问题的方法
2019/09/19 Python
Python-jenkins 获取job构建信息方式
2020/05/12 Python
PyQt5中QSpinBox计数器的实现
2021/01/18 Python
HTML5 localStorage使用总结
2017/02/22 HTML / CSS
Skyscanner波兰:廉价航班
2017/11/07 全球购物
德国苹果商店:MacTrade
2020/05/18 全球购物
JAVA的事件委托机制和垃圾回收机制
2014/09/07 面试题
c语言常见笔试题总结
2016/09/05 面试题
学生就业推荐信
2013/11/13 职场文书
国家奖学金获奖感言
2014/08/16 职场文书
win sever 2022如何占用操作主机角色
2022/06/25 Servers
MySQL实现用逗号进行拼接、以逗号进行分割
2022/12/24 MySQL