jQuery 之表单操做

1、获取表单 DOM 元素

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

  • $("input[type='radio']")
  • $("input[type='checkbox']")
  • $("input[name='username']")

2、获取/设置 表单元素的值

(1)文本框、文本域

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

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

(2)单选、多选

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

3、隐藏域

基本语法:

<input type="hidden" name="field_name" value="value">

特色:

  1. 对于网页访问者来讲,隐藏域是不可见的
  2. 表单提交时,隐藏域会将自身的 namevalue 发送到服务器

用途:

  1. 收集发送数据,能够处理一些特殊的数据,好比用户身份
  2. 只能用于简单的数据储存和传递

4、提交表单

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

实例:url

$.ajax({
    url: 'your_url',
    type: 'POST',
    data: $('form').serialize(),
    success: function () {
        // some code
    },
    error: function () {
        // some code
    }
})
相关文章
相关标签/搜索