jquery获取form表单所有值

使用 jQuery 获取表单所有值

方法一：通过 serialize() 方法
serialize() 方法将表单数据转换为 URL 编码的字符串，适合直接用于 AJAX 请求。

var formData = $('form').serialize();
console.log(formData); // 输出格式如: "name=value&email=test@example.com"

方法二：通过 serializeArray() 方法
serializeArray() 返回一个对象数组，每个对象包含 name 和 value 属性。

var formArray = $('form').serializeArray();
console.log(formArray); // 输出示例: [{name: "name", value: "John"}, ...]

方法三：遍历表单元素手动收集
适用于需要自定义处理的场景，例如排除禁用字段或过滤空值。

var formValues = {};
$('form input, form select, form textarea').each(function() {
    if (this.name) { // 确保元素有 name 属性
        formValues[this.name] = $(this).val();
    }
});
console.log(formValues); // 输出格式: {name: "John", email: "test@example.com"}

注意事项

• 单选框/复选框需特殊处理：使用 :checked 选择器获取选中项的值。
• 多选框（<select multiple>）需通过 .val() 获取数组形式的值。
• 文件输入字段（<input type="file">）无法通过上述方法获取，需使用 FormData 对象。

示例：处理复选框

var checkboxValues = [];
$('input[type="checkbox"]:checked').each(function() {
    checkboxValues.push($(this).val());
});