通过POST AJAX请求提交时如何在表单中添加数据？

Nate 发表于 Dev

内特

我正在使用jQuery的$.ajax()功能来提交表单。我这样传递表单数据：

data: form.serialize()

但是，我想向POST请求添加其他数据。

根据此答案，方法是serializeArray()在表单上使用，然后将数据推送到对象的结果数组上。问题是当我然后尝试序列化结果数组时，jQuery返回错误。

这是一个例子：

<form id="test">
    <input type="hidden" name="firstName" value="John">
    <input type="hidden" name="lastName" value="Doe">
</form>

JS：

console.log($("#test").serialize()); // firstName=John&lastName=Doe 

var data = $("#test").serializeArray();
console.log(data); // [Object, Object]

data.push({name: 'middleName', value: 'Bob'});
console.log(data); // [Object, Object, Object]

console.log(data.serialize()); // Uncaught TypeError: undefined is not a function

JSFiddle

我究竟做错了什么？

马特

正如kapa指出的那样，jQuery允许您serializeArray()直接将从数组中获取的数组作为data参数传递，因此您的代码可以很简单；

var data = $("#test").serializeArray();

data.push({name: 'middleName', value: 'Bob'});

jQuery.ajax({
    data: data,
    // Other params
});

但是，要解释为什么您以前的代码无法正常工作（这里是我先前的回答）；serializeArray()从字面上返回一个数组。数组没有serialize()方法。这就是您的代码失败的原因。

而不是serialize()在从返回的数组上使用serializeArray()，请致电jQuery.param()；

var data = $("#test").serializeArray();

data.push({name: 'middleName', value: 'Bob'});
console.log(jQuery.param(data));

jQuery.param()专门提供，用于将{ name, value }生成的对serializeArray()转换为查询字符串。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。

编辑于2021-02-9

我来说两句

0条评论

登录后参与评论

来自分类Dev