jQuery表单域属性过滤器用法分析


Posted in Javascript onFebruary 10, 2015

本文实例讲述了jQuery表单域属性过滤器用法。分享给大家供大家参考。具体分析如下:

表单内包含各种各样的表单域,使用表单域属性选择器可以很好的获取已被选中的单选按钮,复选框以及列表项,也可以根据是否可用从文档中查找表单域。

1. :checked选择器

用于选择所有被选中的表单域。格式:

$("selector:checked")
可以是input,radio和checkbox

2. :enabled选择器

用于选择所有可用的表单域,格式:

$("selector:enabled")

3. :disabled选择器

用于选择所有被禁用的表单域,格式:

$("selector:disabled")

4. :selected选择器

用于从列表框选择所有选中的option元素,格式:

$("selector:selected")

5. :hidden选择器

用于选择所有的不可见元素

$("selector:hidden")

6. :visible选择器

用于选择所有的可见元素

简单示例:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  

<html xmlns="http://www.w3.org/1999/xhtml">  

<head>  

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  

<title>表单域属性过滤选择器应用示例</title>  

<script type="text/javascript" src="jquery-1.7.min.js"></script>  

<script type="text/javascript">  

$(document).ready(function(){  

     $("input:checked").css("border", "1px solid red");  

     $("input:disabled").css("background", "#FCF");  

     $("input:enabled").val("可用文本框");  

});

</script>  

</head>  

<body>  

<h3 align="center">表单域属性过滤选择器应用示例</h3>  

<table width="602" height="81" border="1">  

  <tr>  

    <td width="118">复选框:</td>  

    <td width="443"><input type="checkbox" checked="checked" />被选中的复选框  

    <input type="checkbox" checked="checked" />被选中的复选框  

    <input type="checkbox" />没有被选中的复选框  

    </td>  

  </tr>  

  <tr>  

    <td>可用文本框:</td>  

    <td><input type="text"/></td>  

  </tr>  

  <tr>  

    <td>不可用文本框:</td>  

    <td><input type="text" disabled="disabled" /></td>  

  </tr>  

   <tr>  

    <td>下拉列表</td>  

    <td>  

    <select name="test" >  

     <option>浙江</option>  

     <option>湖南</option>  

     <option selected="selected">北京</option>  

     <option selected="selected">天津</option>  

     <option>广州</option>   

     <option>湖北</option>  

  </select>  

  </td>  

  </tr>  

</table>  

</body>  

</html>

效果图:

jQuery表单域属性过滤器用法分析

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

Javascript 相关文章推荐
精解window.setTimeout()&amp;window.setInterval()使用方式与参数传递问题!
Nov 23 Javascript
Prototype Hash对象 学习
Jul 19 Javascript
简单选项卡 js和jquery制作方法分享
Feb 26 Javascript
jquery+html5制作超酷的圆盘时钟表
Apr 14 Javascript
使用iojs的jsdom库实现同步系统时间
Apr 20 Javascript
详解参数传递四种形式
Jul 21 Javascript
js实现图片上传并正常显示
Dec 19 Javascript
原生js编写autoComplete插件
Apr 13 Javascript
JS中的hasOwnProperty()和isPrototypeOf()属性实例详解
Aug 11 Javascript
微信小程序 开发之快递查询功能的实现
Jan 09 Javascript
vue 添加vux的代码讲解
Nov 30 Javascript
JavaScript监听键盘事件代码实现
Jun 03 Javascript
jQuery子属性过滤选择器用法分析
Feb 10 #Javascript
jQuery内容过滤选择器用法分析
Feb 10 #Javascript
jQuery过滤选择器用法分析
Feb 10 #Javascript
jQuery表单域选择器用法分析
Feb 10 #Javascript
jQuery层级选择器用法分析
Feb 10 #Javascript
Jquery中CSS选择器用法分析
Feb 10 #Javascript
transport.js和jquery冲突问题的解决方法
Feb 10 #Javascript
You might like
PHP中基本符号及使用方法
2010/03/23 PHP
php中数组首字符过滤功能代码
2012/07/31 PHP
jQuery 开发者应该注意的9个错误
2012/05/03 Javascript
JS获取后台Cookies值的小例子
2013/03/04 Javascript
JavaScript中双叹号!!作用示例介绍
2014/09/21 Javascript
深入理解JavaScript系列(39):设计模式之适配器模式详解
2015/03/04 Javascript
js简单的点击返回顶部效果实现方法
2015/04/10 Javascript
Javascript实现检测客户端类型代码封包
2015/12/03 Javascript
详解JavaScript对象序列化
2016/01/19 Javascript
js判断出两个字符串最大子串的函数实现方法
2016/11/01 Javascript
JSONP跨域请求
2017/03/02 Javascript
Nodejs模块载入运行原理
2018/02/23 NodeJs
vue实现未登录跳转到登录页面的方法
2018/07/17 Javascript
vue 纯js监听滚动条到底部的实例讲解
2018/09/03 Javascript
vue中利用simplemde实现markdown编辑器(增加图片上传功能)
2019/04/29 Javascript
微信小程序自定义头部导航栏(组件化)
2019/11/15 Javascript
openlayers实现图标拖动获取坐标
2020/09/25 Javascript
Python中利用函数装饰器实现备忘功能
2015/03/30 Python
Python常见加密模块用法分析【MD5,sha,crypt模块】
2017/05/24 Python
使用Python如何测试InnoDB与MyISAM的读写性能
2018/09/18 Python
Python http接口自动化测试框架实现方法示例
2018/12/06 Python
Python单元测试unittest的具体使用示例
2018/12/17 Python
python 利用Pyinstaller打包Web项目
2020/10/23 Python
基于Python实现天天酷跑功能
2021/01/06 Python
荷兰本土平价百货:HEMA
2017/10/23 全球购物
设计师大码女装:11 Honoré
2020/05/03 全球购物
亚洲领先的设计购物网站:Pinkoi
2020/11/26 全球购物
数据库设计的包括哪两种,请分别进行说明
2016/07/15 面试题
毕业生自我鉴定
2013/12/04 职场文书
环保倡议书
2014/04/14 职场文书
献爱心大型公益活动策划方案
2014/09/15 职场文书
2015年超市收银员工作总结
2015/04/25 职场文书
2016年国培研修日志
2015/11/13 职场文书
浅析Python中的随机采样和概率分布
2021/12/06 Python
MySQL日期时间函数知识汇总
2022/03/17 MySQL
MySQL实现配置主从复制项目实践
2022/03/31 MySQL