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 跳转代码集合
Dec 03 Javascript
setTimeout的延时为0时多个浏览器的区别
May 23 Javascript
jquery实现左右无缝轮播图
Jul 31 Javascript
AngularJs中Bootstrap3 datetimepicker使用实例
Dec 13 Javascript
javascript基础练习之翻转字符串与回文
Feb 20 Javascript
angular 用拦截器统一处理http请求和响应的方法
Jun 08 Javascript
vue服务端渲染添加缓存的方法
Sep 18 Javascript
原生js基于canvas实现一个简单的前端截图工具代码实例
Sep 10 Javascript
解决Nuxt使用axios跨域问题
Jul 06 Javascript
对vuex中store和$store的区别说明
Jul 24 Javascript
解决Vue项目中tff报错的问题
Oct 21 Javascript
vue下拉刷新组件的开发及slot的使用详解
Dec 23 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
PHP中数组的三种排序方法分享
2012/05/07 PHP
PHP中函数rand和mt_rand的区别比较
2012/12/26 PHP
解析PHP提交后跳转
2013/06/23 PHP
Codeigniter+PHPExcel实现导出数据到Excel文件
2014/06/12 PHP
PHP中使用json数据格式定义字面量对象的方法
2014/08/20 PHP
thinkPHP3.2简单实现文件上传的方法
2016/05/16 PHP
Laravel Eloquent ORM 实现查询表中指定的字段
2019/10/17 PHP
你的编程语言可以这样做吗?
2006/09/07 Javascript
javascript中的new使用
2010/03/20 Javascript
JQuery扩展插件Validate 2通过参数设置验证规则
2011/09/05 Javascript
基于jquery &amp; json的省市区联动代码
2012/06/26 Javascript
jQuery 1.8 Release版本发布了
2012/08/14 Javascript
jquery插件jSignature实现手动签名
2015/05/04 Javascript
JavaScript  event对象整理及详细介绍
2016/10/10 Javascript
jQuery实现checkbox列表的全选、反选功能
2016/11/24 Javascript
详解javascript获取url信息的常见方法
2016/12/19 Javascript
微信小程序中子页面向父页面传值实例详解
2017/03/20 Javascript
聊聊JavaScript如何实现继承及特点
2017/04/07 Javascript
javascript实现的字符串转换成数组操作示例
2019/06/13 Javascript
解决Vue 移动端点击出现300毫秒延迟的问题
2020/07/21 Javascript
JavaScript JSON使用原理及注意事项
2020/07/30 Javascript
python中类和实例如何绑定属性与方法示例详解
2017/08/18 Python
对命令行模式与python交互模式介绍
2018/05/12 Python
Python基于分析Ajax请求实现抓取今日头条街拍图集功能示例
2018/07/19 Python
Python绘制并保存指定大小图像的方法
2019/01/10 Python
python基于pdfminer库提取pdf文字代码实例
2019/08/15 Python
Tensorflow: 从checkpoint文件中读取tensor方式
2020/02/10 Python
html2canvas生成清晰的图片实现打印的示例代码
2019/09/30 HTML / CSS
印尼美容产品购物网站:PerfectBeauty.id
2017/12/01 全球购物
ESDlife健康生活易:身体检查预订、搜寻及比较
2019/05/10 全球购物
MYSQL支持事务吗
2013/08/09 面试题
物流经理自我评价
2013/09/23 职场文书
竞选副班长演讲稿
2014/04/24 职场文书
职工的安全责任书范文!
2019/07/02 职场文书
关于Numpy之repeat、tile的用法总结
2021/06/02 Python
vue动态绑定style样式
2022/04/20 Vue.js