热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

[jQuery知识]jQuery之知识六-表单操作

前言1.常规选择器2.表单选择器3.表单过滤器表单作为HTML中一种特殊的元素,操作方法较为多样性和特殊性,开发者不但可以使用之前的常规选择器或过滤器,也可以使

前言

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

继续看下一章[jQuery知识]jQuery之知识体系


推荐阅读
  • 本篇文章为大家展示了input语句的作用有哪些,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。HTML标签 ... [详细]
  • 这是原文链接:sendingformdata许多情况下,我们使用表单发送数据到服务器。服务器处理数据并返回响应给用户。这看起来很简单,但是 ... [详细]
  • 本文介绍了南邮ctf-web的writeup,包括签到题和md5 collision。在CTF比赛和渗透测试中,可以通过查看源代码、代码注释、页面隐藏元素、超链接和HTTP响应头部来寻找flag或提示信息。利用PHP弱类型,可以发现md5('QNKCDZO')='0e830400451993494058024219903391'和md5('240610708')='0e462097431906509019562988736854'。 ... [详细]
  • Ihavethefollowingonhtml我在html上有以下内容<html><head><scriptsrc..3003_Tes ... [详细]
  • ①页面初始化----------收到客户端的请求,产生相应页面的Page对象,通过Page_Init事件进行page对象及其控件的初始化.②加载视图状态-------ViewSta ... [详细]
  • 前端库Bootstrap框架:「11]使用 span 创建行内元素
    前端库Bootstrap框架:「11]使用 span 创建行内元素 ... [详细]
  • 第二次网页前端培训笔记(表单,INPUT及常用字符)
    1.表单form2.INPUT编号: ... [详细]
  • 前端判断登陆页面输入是否符合要求 ... [详细]
  • 文章发布实例这个例子,因为前两章是字符串处理和正则表达式,所以重点也就用了这些内容。首先,进的事post.php这个文件<formmethodpostactio ... [详细]
  • CSS3选择器的使用方法详解,提高Web开发效率和精准度
    本文详细介绍了CSS3新增的选择器方法,包括属性选择器的使用。通过CSS3选择器,可以提高Web开发的效率和精准度,使得查找元素更加方便和快捷。同时,本文还对属性选择器的各种用法进行了详细解释,并给出了相应的代码示例。通过学习本文,读者可以更好地掌握CSS3选择器的使用方法,提升自己的Web开发能力。 ... [详细]
  • android listview OnItemClickListener失效原因
    最近在做listview时发现OnItemClickListener失效的问题,经过查找发现是因为button的原因。不仅listitem中存在button会影响OnItemClickListener事件的失效,还会导致单击后listview每个item的背景改变,使得item中的所有有关焦点的事件都失效。本文给出了一个范例来说明这种情况,并提供了解决方法。 ... [详细]
  • 拥抱Android Design Support Library新变化(导航视图、悬浮ActionBar)
    转载请注明明桑AndroidAndroid5.0Loollipop作为Android最重要的版本之一,为我们带来了全新的界面风格和设计语言。看起来很受欢迎࿰ ... [详细]
  • 深入理解CSS中的margin属性及其应用场景
    本文主要介绍了CSS中的margin属性及其应用场景,包括垂直外边距合并、padding的使用时机、行内替换元素与费替换元素的区别、margin的基线、盒子的物理大小、显示大小、逻辑大小等知识点。通过深入理解这些概念,读者可以更好地掌握margin的用法和原理。同时,文中提供了一些相关的文档和规范供读者参考。 ... [详细]
  • 在Xamarin XAML语言中如何在页面级别构建ControlTemplate控件模板
    本文介绍了在Xamarin XAML语言中如何在页面级别构建ControlTemplate控件模板的方法和步骤,包括将ResourceDictionary添加到页面中以及在ResourceDictionary中实现模板的构建。通过本文的阅读,读者可以了解到在Xamarin XAML语言中构建控件模板的具体操作步骤和语法形式。 ... [详细]
  • JavaScript和HTML之间的交互是经由过程事宜完成的。事宜:文档或浏览器窗口中发作的一些特定的交互霎时。能够运用侦听器(或处置惩罚递次来预订事宜),以便事宜发作时实行相应的 ... [详细]
author-avatar
E-sc68
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有