jQuery 之表单操作

一、获取表单 DOM 元素

除了使用 id 和 class 选择器之外，对于表单元素还可通过 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)

三、隐藏域

基本语法：

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

特点：

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

用途：

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

四、提交表单

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

实例：

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