尝试使用jQuery序列化()表单数据并使用extend()追加更多变量

Question

我正在使用$.ajax提交表单,但我想在提交中添加一些不属于表单输入的键值对.连接这些额外参数的技术工作正常,但似乎不太优雅使用$.extend.麻烦的是我不能让后者工作.

这有效:

var data = $form.serialize() + "&a=1&b=0.5";

这不是:

var data = $.extend({}, $form.serialize(), {
    a: 1,
    b: 0.5
});

我可以看到当我检查有效的情况下提交的内容时,我有三个键值对:

t:test
a:1
b:0.5

t单个表单输入字段的名称(文本框)在哪里.

当我使用该$.extend功能时,检查显示以下内容:

0:t
1:=
2:t
3:e
4:s
5:t
a:1
b:0.5

我的申请不喜欢这个请求.这种行为是预期的还是有人可以指出我做错了什么？

Answer 1

你的问题是因为.serialize()只使用jQuery表单对象并在其中进行序列化.extend()将获得[object] [object]表单的值(因为这不是正确的方法.我提出两个解决方案:

第一个解决方案 克隆jQuery的表单,向其添加项目并序列化

var $form = $('#form').clone()
          .append('<input name="foo" value="1" />')
          .append('<input name="bar" value="2" />')
          .serialize();

第二个解决方案 使用表单的值填充对象,然后进行参数化

var data = $(foo:"value1", bar:"value2");
$('form').find(':input').each(function () {
    if (this.name) {
        data[this.name] = this.value;
    }
});

data = $.param(data)