jquery 表单选择器

 Jquery表单过滤选择器

表单对象属性过滤选择器

选择器                 描述                                              返回                示例

:enabled              选择所有可用元素                          集合元素         $("#form1  :enabled");选取ID为"form1"的表单内的所有可用元素

:disabled             选取所有不可用元素                       集合元素         $(#form2   :disabled);选取id为"from2"的表单内的所有不可用元素

:checked             选取所有被选中的元素                   集合元素         $("input:checked")选取所有被选中的<input>元素

:selected            选取所有被选中的选项元素（下拉）集合元素        $("select:selected");选取所有被选中的选项元素

 

表单对象属性过滤示例：

作用                                                                                                       代码

改变表单内可用<input>元素的值                                                            $("#form1  input:enabled")

                                                                                                                                       .val("这里变化了");

改变表单内不可用<input>元素的值                                                         $("#form1  input:disabled")

                                                                                                                                       .val("这里变化了");

获取多选框选中的个数                                                                            $("input:checked").length;

获取下拉框选中的内容                                                                            $("select  :selected").text();

 

表单对象属性过滤示例

选择器材             描述                                                 返回                示例

:input                    选取所有的<input>,<textarea>         集合元素         $(":input")选取所有<input>,<textarea>.<select>和<button>元素

                             <select>和<button>元素

:text                      选取所有的单选文本框                     集合元素         $(":text")选取所有的单选文本框

:password            选取所有的密码框                            集合元素          $(":password")选取所有的密码框

：radio                选取所有的单选框                            集合元素          $(":radio")选取所有的单选框

:checkbox            选取所有的多选框                            集合元素          $(":checkbox");选取所有的复选框

:submit                选取所有的提交按钮                         集合元素           $(":submit")选取所有的提交按钮

:image                 选取所有的图像按钮                         集合元素           $(":image");选取所有的图像按钮

:reset                  选取所有的重置按钮                         集合元素           $(":reset");选取所有的重置按钮

:button                选取所有的按钮                                集合元素            $(":button"); 选取所有的按钮

：file                   选取所有的上传域                             集合元素            $(":hidden")选取所有不可见元素

下面把这些表单选择器运用到下面的表单中，对表单进行操作

如果想得到表单内表单元素的个数，代码如下：

$("#form1  :input").length;        //注意与$("#form1   input")的区别

如果想得到表单内单行文本框的个数，代码如下：

$("#form1   :text").length;

如果想得到表单内密码框的个数，代码如下：

$("#form1   :password").length;

同理，其他表单选择器的操作与此类似

 

获取页面中的所有<p>元素，给每一个<p>元素添加onclick事件，例如：

$("p").click(function({

            //doing somethingr（操作）

})

 

获取id为tb的元素，然后寻找它下面的tbody标签，再寻找tbody下索引值是偶数的tr元素改变它的背景色(css("property","value");用来设置jQuery对象的样式)例如：

$('#tb tbody tr:even').css("backgroundColor","#888");

先使用属性选择器，然后用表单对象属性过滤，最后获取jQuery对象的长度,例如：

$('#btn').click(function(){

                  var   length=$("input[name='check']:checked").length;

                  alert("选中的个数为："+length);

})

清空所有input type="text" 文本框内容：$("input:text").val("");