Jquery选择器(八) -- Forms

[b][size=large]表单选择器[/size][/b]


[b][1][color=brown] :input[/color][/b] [color=blue]Returns: Array<Element(s)>[/color]
[color=olive]说明[/color]： 匹配所有input, textarea, select和button元素。

var allInputs = $(":input");
var formChildren = $("form > *");
$("#messages").text("Found " + allInputs.length + " inputs and the form has " +
                       formChildren.length + " children.");
    // so it won't submit
$("form").submit(function () { return false; }); 

[b][2][color=brown] :text[/color][/b] [color=blue]Returns: Array<Element(s)>[/color]
[color=olive]说明[/color]： 匹配所有类型为text的表单。
使用这个伪类选择器$(":text")等同于$("*:text")，是一个非常慢的选择器。因此建议使用$("input:text")。

var input = $("form input:text").css({background:"yellow", border:"3px red solid"});

[b][3][color=brown] :password[/color][/b] [color=blue]Returns: Array<Element(s)>[/color]
[color=olive]说明[/color]： 匹配所有类型为password的表单。

var input = $("form input:password").css({background:"yellow", border:"3px red solid"});

[b][4][color=brown] :radio[/color][/b] [color=blue]Returns: Array<Element(s)>[/color]
[color=olive]说明[/color]： 匹配所有类型为radio的表单。
使用这个伪类选择器$(":radio")等同于$("*:radio")，是一个非常慢的选择器。因此建议使用$("input:radio")。
若要选择一组相关联的单选按钮,可以使用$("input[name=gender]:radio")

var input = $("form input:radio").css({background:"yellow", border:"3px red solid"});

[b][5][color=brown] :checkbox [/color][/b] [color=blue]Returns: Array<Element(s)>[/color]
[color=olive]说明[/color]： 匹配所有类型为checkbox的表单。

var input = $("form input:checkbox").css({background:"yellow", border:"3px red solid"});

[b][6][color=brown] :submit[/color][/b] [color=blue]Returns: Array<Element(s)>[/color]
[color=olive]说明[/color]： 匹配所有类型为submit的表单。

var input = $(":submit").parent('td').css({background:"yellow", border:"3px red solid"});

[b][7][color=brown] :image[/color][/b] [color=blue]Returns: Array<Element(s)>[/color]
[color=olive]说明[/color]： 匹配所有类型为image的表单。

var input = $(":image").css({background:"yellow", border:"3px red solid"});

[b][8][color=brown] :reset[/color][/b] [color=blue]Returns: Array<Element(s)>[/color]
[color=olive]说明[/color]： 匹配所有类型为reset的表单。

var input = $(":reset").css({background:"yellow", border:"3px red solid"});

[b][9][color=brown] :button[/color][/b] [color=blue]Returns: Array<Element(s)>[/color]
[color=olive]说明[/color]： 匹配所有类型为button的表单和button元素( <button></button> )。

var input = $(":button").css({background:"yellow", border:"3px red solid"});

[b][10][color=brown] :file[/color][/b] [color=blue]Returns: Array<Element(s)>[/color]
[color=olive]说明[/color]： 匹配所有类型为file的表单)。

var input = $(":file").css({background:"yellow", border:"3px red solid"});

--------------------------------------------------------------------------------------------------------------------------------------------------------