学习要点:

  • 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(); //获取下拉列表中被选中的元素

Jquery7 表单选择器的更多相关文章

  1. 深入学习jQuery选择器系列第七篇——表单选择器

    × 目录 [1]表单元素 [2]对象属性 前面的话 无论是提交还是传递数据,表单元素在动态交互页面的作用是非常重要的.jQuery专门加入了表单选择器,从而能够极其方便地获取到某个类型的表单元素 表单 ...

  2. JQuery_表单选择器

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

  3. jquery表单选择器

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

  4. 三、jQuery--jQuery基础--jQuery基础课程--第4章 jQuery表单选择器

    1.:input表单选择器 如何获取表单全部元素?:input表单选择器可以实现,它的功能是返回全部的表单元素,不仅包括所有<input>标记的表单元素,而且还包括<textarea ...

  5. jQuery选择器介绍:基本选择器、层次选择器、过滤选择器、表单选择器

    选择器是jQuery的根基,在jQuery中,对事件处理.遍历DOM和Ajax操作都依赖于选择器.因此,如果能熟练的使用选择器,不仅能简化代码,而且可以达到事半功倍的效果.jQuery选择器完全继承了 ...

  6. jQuery编程基础精华02(属性、表单过滤器,元素的each,表单选择器,子元素过滤器(*),追加方法,节点,样式操作)

    属性.表单过滤器 属性过滤选择器: $("div[id]")选取有id属性的<div> $("div[title=test]")选取title属性为 ...

  7. jQuery学习笔记(一)——基础选择器、过滤选择器、表单选择器

    $()就是jQuery中的函数,它的功能是获得()中指定的标签元素.如演示样例中$("p")会得到一组P标签元素,当中"p"表示CSS中的标签选择器.$()中的 ...

  8. 009 jquery过滤选择器-----------(表单对象属性过滤选择器 与 表单选择器)

    1.表单对象属性选择器 2.程序 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...

  9. jQuery的表单选择器

    1.常规选择器选择表单标签 $(function () { // var a = $("input").eq(0).val() // alert(a) // // var b = ...

随机推荐

  1. js 跨域 之 修改服务器配置-XAMPP-Apache (nginx 拉到最后!)

    js高程第21章提到了ajax 跨域技术,方法有很多,如图: 我主要讲这个: 其实代码就是这样就好了,当然只兼容 IE9 及之后的版本 ,IE9 之前的版本请去原书看吧,Page 600 var xh ...

  2. Hibernate的二级缓存(SessionFaction的外置缓存)-----Helloword

    1. 使用 Hibernate 二级缓存的步骤: 1). 加入二级缓存插件的 jar 包及配置文件: I. 复制 \hibernate-release-4.2.4.Final\lib\optional ...

  3. Hibernate-sessio缓存的操作

    首先咋们看一个图: flush:首先箭头是由缓存指向数据库,即当我调用 Session.flush()方法时它会强制使数据库的记录跟缓存 中的对象状态保持同步 ,如果不一致,就会发送Sql语句 ,保持 ...

  4. Buffer Data

    waylau/netty-4-user-guide: Chinese translation of Netty 4.x User Guide. 中文翻译<Netty 4.x 用户指南> h ...

  5. 微信公众号获取用户openId How to use cURL to get jSON data and decode the data?

    w http://stackoverflow.com/questions/16700960/how-to-use-curl-to-get-json-data-and-decode-the-data

  6. iros2016-Monday 10/10/2016

    Workshop Day Integrating Multiple Knowledge Representation and Reasoning Techniques in Robotics (MIR ...

  7. <2014 12 28> Some conclusions and thought recently

    Since last year August when I started to prepare for the IELTS examiation, it took one year's time f ...

  8. 015-HQL中级5-hive创建索引

    索引是hive0.7之后才有的功能,创建索引需要评估其合理性,因为创建索引也是要磁盘空间,维护起来也是需要代价的 创建索引 hive> create index [index_studentid ...

  9. 简单的SQL注入学习

    引贴: http://blog.163.com/lucia_gagaga/blog/static/26476801920168184648754/ 首先需要编写一个php页面,讲php页面放入/opt ...

  10. intellij idea 重命名或复制一个项目(不用重启)

    Idea 内无法直接修改Explorer 里文件夹的名称,只能手动改文件夹的名称. 目前找到的最好的方法: 1)重命名一个项目 在Idea 项目关闭状态下,在 Explorer (Windows) / ...