基于jQuery选择器之表单对象属性筛选选择器的实例


Posted in jQuery onSeptember 19, 2017

基于jQuery选择器之表单对象属性筛选选择器的实例

<!DOCTYPE html>
<html>

<head>
  <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
  <title></title>
  <link rel="stylesheet" href="imooc.css" rel="external nofollow" type="text/css">
  <style>
  input {
    display: block;
    margin: 10px;
    padding: 10px;
  }
  </style>
  <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>

<body>
  <h2>子元素筛选选择器</h2>
  <h3>enabled、disabled</h3>
  <form>
    <input type="text" value="未设置disabled" />
    <input type="text" value="设置disabled" disabled />
    <input type="text" value="未设置disabled" />
  </form>

  <script type="text/javascript">
    //查找所有input所有可用的(未被禁用的元素)input元素。
    $("input:enabled").css("border", "2px groove red");
  </script>

  <script type="text/javascript">
    //查找所有input所有不可用的(被禁用的元素)input元素。
    $("input:disabled").css("border", "2px groove blue");
  </script>

  <h3>checked、selected</h3>
  <form>
    <input type="checkbox" checked="checked">
    <input type="checkbox">
    <input type="radio" checked>    
    <input type="radio">
    
    <select name="garden" multiple="multiple">
      <option>imooc</option>
      <option selected="selected">慕课网</option>
      <option>aaron</option>
      <option selected="selected">博客园</option>
     </select>

  </form>

  <script type="text/javascript">
     //查找所有input所有勾选的元素(单选框,复选框)
     //移除input的checked属性
    $("input:checked").removeAttr('checked')
  </script>

  <script type="text/javascript">
     //查找所有option元素中,有selected属性被选中的选项
     //移除option的selected属性
    $("option:selected").removeAttr('selected')
  </script>

</body>

</html>

注意:

在某些浏览器中,选择器:checked可能会错误选取到<option>元素,所以保险起见换用选择器input:checked,确保只会选取<input>元素

以上这篇jQuery选择器之表单对象属性筛选选择器实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jQuery插件FusionCharts绘制ScrollColumn2D图效果示例【附demo源码下载】
Mar 22 jQuery
jQuery实现简单漂亮的Nav导航菜单效果
Mar 29 jQuery
jQuery动态追加页面数据以及事件委托详解
May 06 jQuery
jquery+ajax实现省市区三级联动 (封装和不封装两种方式)
May 15 jQuery
jQuery实现火车票买票城市选择切换功能
Sep 15 jQuery
jQuery 实现左右两侧菜单添加、移除功能
Jan 02 jQuery
jQuery实现的淡入淡出图片轮播效果示例
Aug 29 jQuery
jQuery点击页面其他部分隐藏下拉菜单功能
Nov 27 jQuery
Jquery动态列功能完整实例
Aug 30 jQuery
用jQuery实现抽奖程序
Apr 12 jQuery
JQuery实现折叠式菜单的详细代码
Jun 03 jQuery
详解jQuery的核心函数和事件处理
Feb 18 jQuery
jQuery选择器之子元素选择器详解
Sep 18 #jQuery
jQuery实现的表格前端排序功能示例
Sep 18 #jQuery
jQuery实现对网页节点的增删改查功能示例
Sep 18 #jQuery
jQuery UI 实例讲解 - 日期选择器(Datepicker)
Sep 18 #jQuery
jQuery实现火车票买票城市选择切换功能
Sep 15 #jQuery
jQuery获取复选框选中的当前行的某个字段的值
Sep 15 #jQuery
jQuery plugin animsition使用小结
Sep 14 #jQuery
You might like
PHP之autoload运行机制实例分析
2014/08/28 PHP
PHP生成唯一订单号
2015/07/05 PHP
既简单又安全的PHP验证码 附调用方法
2016/06/02 PHP
PHP的mysqli_thread_id()函数讲解
2019/01/24 PHP
使用jQuery+HttpHandler+xml模拟一个三级联动的例子
2011/08/09 Javascript
js确定对象类型方法
2012/03/30 Javascript
Extjs优化(一)删除冗余代码提高运行速度
2013/04/15 Javascript
js和php如何获取当前url的内容
2013/09/22 Javascript
JavaScript中的常见问题解决方法(乱码,IE缓存,代理)
2013/11/28 Javascript
jQuery中before()方法用法实例
2014/12/25 Javascript
JavaScript按值删除数组元素的方法
2015/04/24 Javascript
JavaScript字符串常用的方法
2016/03/10 Javascript
Angularjs根据json文件动态生成路由状态的实现方法
2017/04/17 Javascript
BootStrap Select清除选中的状态恢复默认状态
2017/06/20 Javascript
Extjs 中的 Treepanel 实现菜单级联选中效果及实例代码
2017/08/22 Javascript
微信小程序之滚动视图容器的实现方法
2017/09/26 Javascript
详解Chai.js断言库API中文文档
2018/01/31 Javascript
vue-cli项目修改文件热重载失效的解决方法
2018/09/19 Javascript
使用preload预加载页面资源时注意事项
2020/02/03 Javascript
JavaScript实现鼠标移入随机变换颜色
2020/11/24 Javascript
[43:51]2014 DOTA2国际邀请赛中国区预选赛 Dream Times VS TongFu
2014/05/22 DOTA
让python同时兼容python2和python3的8个技巧分享
2014/07/11 Python
Python如何获取系统iops示例代码
2016/09/06 Python
Python3.4学习笔记之类型判断,异常处理,终止程序操作小结
2019/03/01 Python
Django 开发环境配置过程详解
2019/07/18 Python
浅谈对pytroch中torch.autograd.backward的思考
2019/12/27 Python
HTML页面中添加Canvas标签示例
2015/01/01 HTML / CSS
艺术系应届生的自我评价
2013/10/19 职场文书
物业管理计划书
2014/01/10 职场文书
教师个人自我鉴定
2014/02/08 职场文书
《夹竹桃》教学反思
2014/04/20 职场文书
承兑汇票转让证明怎么写?
2014/11/30 职场文书
会计求职自荐信
2015/03/26 职场文书
2015年党务公开工作总结
2015/05/19 职场文书
如何写观后感
2015/06/19 职场文书
python处理json数据文件
2022/04/11 Python