资讯专栏INFORMATION COLUMN

jQuery 之表单操作

renweihub / 1737人阅读

摘要:一获取表单元素除了使用和选择器之外,对于表单元素还可通过以及属性选择表单元素,实例二获取设置表单元素的值文本框文本域当表单的值为字符串时,可用方法去除字符串前后的空格方法不传参数,视为获取值,否则视为设置值单选多选判断是否选中设置选中状态第

一、获取表单 DOM 元素

除了使用 idclass 选择器之外,对于表单元素还可通过 type 以及 name 属性选择表单元素,实例:

$("input[type="radio"]")

$("input[type="checkbox"]")

$("input[name="username"]")

二、获取/设置 表单元素的值 (1)文本框、文本域

当表单的值为字符串时,可用 $.trim() 方法去除字符串前后的空格

val() 方法不传参数,视为获取 value 值,否则视为设置 value
$("input[type="text"]").val()

(2)单选、多选

判断是否选中:
$("input[type="radio"]").is(":checked")

设置选中状态(第二个参数为 false,则取消选中):
$("input[type="radio"]").prop("checked", true)

三、隐藏域 基本语法:
特点:

对于网页访问者来说,隐藏域是不可见的

表单提交时,隐藏域会将自身的 namevalue 发送到服务器

用途:

收集发送数据,可以处理一些特殊的数据,比如用户身份

只能用于简单的数据储存和传递

四、提交表单

在提交表单时需将表单元素集合的值传递给后台,serialize() 的作用是将选择的表单元素的 vlaue 值序列化为字符串。

实例:

$.ajax({
    url: "your_url",
    type: "POST",
    data: $("form").serialize(),
    success: function () {
        // some code
    },
    error: function () {
        // some code
    }
})

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/84746.html

相关文章

  • jQuery设计思想理解篇

    摘要:创建新元素的方法非常简单,只要把新元素直接传入的构造函数就行了七工具方法设计思想之六除了对选中的元素进行操作以外,还提供一些与元素无关的工具方法。八事件操作设计思想之七,就是把事件直接绑定在网页元素之上。 转自:阮一峰 2011年7月26日 http://www.ruanyifeng.com/blo... jQuery是目前使用最广泛的JavaScript函数库。 据统计,全世界排名...

    newsning 评论0 收藏0
  • 代码片段jQuery控制input只能输入数字和两位小数

    摘要:前言做为一个,难免会遇到那种表单中限制输入的问题,比如,限制空格的输入,只允许输入数字,以及小数点的控制等等,这里,我们就说一下数字的限制。 showImg(https://segmentfault.com/img/remote/1460000019199762?w=1350&h=900); 前言 做为一个PHPER,难免会遇到那种表单中jQuery限制输入的问题,比如,限制空格的输入...

    iOS122 评论0 收藏0
  • 代码片段jQuery控制input只能输入数字和两位小数

    摘要:前言做为一个,难免会遇到那种表单中限制输入的问题,比如,限制空格的输入,只允许输入数字,以及小数点的控制等等,这里,我们就说一下数字的限制。 showImg(https://segmentfault.com/img/remote/1460000019199762?w=1350&h=900); 前言 做为一个PHPER,难免会遇到那种表单中jQuery限制输入的问题,比如,限制空格的输入...

    MingjunYang 评论0 收藏0
  • jQuery Validate 表单验证强大插件

    摘要:返回为真,表示需要验证。注意在文件中添加只能包括中文字英文字母数字和下划线。中文名称返回类型描述验证所选的。检查是否验证通过。提交表单后,未通过验证的表单第一个或提交之前获得焦点的未通过验证的表单会获得焦点。 jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求。该插件捆绑了一套有用的验证方法,包括 ...

    zorpan 评论0 收藏0
  • 前端技术 博客文章、书籍 积累

    摘要:好多编辑器例如等都支持这样的语法来快速的编写代码如何优雅地使用把标签放在结束标签之后结束标签之前的差别什么是响应式设计怎样进行 书籍 《JavaScriptDOM编程艺术》《JavaScript高级程序设计》《JavaScript框架设计》《JavaScript专家编程》《JavaScript Ninjia》《JavaScript语言精粹(修订版)》《JavaScript设计模式》《J...

    LiangJ 评论0 收藏0

发表评论

0条评论

renweihub

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<