标题 | jQuery表单域属性过滤器用法分析 |
内容 | 这篇文章主要介绍了jQuery表单域属性过滤器用法,实例分析了:checked、:enabled、:disabled:、selected等常用表单域属性过滤器使用技巧,需要的朋友可以参考下 本文实例讲述了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" ""> <html xmlns=""> <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>表单域属性过滤选择器应用示例</h3> <table width="602" height="81"> <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程序设计有所帮助。 |
随便看 |
|
在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。