第7章 表单选择器

学习要点：
1.常规选择器
2.表单选择器
3.表单过滤器


表单作为 HTML 中一种特殊的元素，操作方法较为多样性和特殊性，开发者不但可以使用之前的常规选择器或过滤器，也可以使用 jQuery 为表单专门提供的选择器和过滤器来准确的定位表单元素。

一．常规选择器
我们可以使用 id、 类(class)和元素名来获取表单字段， 如果是表单元素， 都必须含有 name属性，还可以结合属性选择器来精确定位。

$('input').val(); //元素名定位，默认获取第一个
$('input').eq(1).val(); //同上，获取第二个
$('input[type=password]').val(); //选择 type 为 password 的字段
$('input[name=user]').val(); //选择 name 为 user 的字段

 
那么对于 id 和类(class)用法比较类似，也可以结合属性选择器来精确的定位，在这里我们不在重复。对于表单中的其他元素名比如：textarea、select 和 button 等，原理一样，不在重复。

二．表单选择器
虽然可以使用常规选择器来对表单的元素进行定位， 但有时还是不能满足开发者灵活多变的需求。所以，jQuery 为表单提供了专用的选择器。


 

$(':input').size(); //获取所有表单字段元素
$(':text).size(); //获取单行文本框元素
$(':password').size(); //获取密码栏元素
$(':radio).size(); //获取单选框元素
$(':checkbox).size(); //获取复选框元素
$(':submit).size(); //获取提交按钮元素
$(':reset).size(); //获取重置按钮元素
$(':image).size(); //获取图片按钮元素
$(':file).size(); //获取文件按钮元素
$(':button).size(); //获取普通按钮元素
$(':hidden).size(); //获取隐藏字段元素

 
注意：这些选择器都是返回元素集合，如果想获取某一个指定的元素，最好结合一下属性选择器。比如：

$(':text[name=user]).size(); //获取单行文本框 name=user 的元素

 
三．表单过滤器
jQuery 提供了四种表单过滤器， 分别在是否可以用、 是否选定来进行表单字段的筛选过滤。

 

$(':enabled').size(); //获取可用元素
$(':disabled).size(); //获取不可用元素
$(':checked).size(); //获取单选、复选框中被选中的元素
$(':selected).size(); //获取下拉列表中被选中的元素