Question

我有一个登录表单，我想发送一个包含json的帖子。

这是我到目前为止所做的。

<form id="myForm">
    Login
    <input  id="login" type="text" name="login" value=""/>
    Password
    <input id="password" type="password" name="password" value=""/>
    <button type="submit" >Login</button>
</form>

和我的js文件

$("#myForm").submit(function(event) {
    var frm = $("#myForm");
    var data = JSON.stringify(frm);

    event.preventDefault();

    $.ajax({
        url: "/register/",
        data: data,
        type: "POST",
        contentType: "application/json"
    });
});

这是jsfiddle https://jsfiddle.net/p143s6tp/

我希望json看起来像这样：

{ 
   "login" : "some_value",
   "password" : "some_value"
}

但我得到了这个：

{"0":{"0":{},"1":{},"2":{}},"length":1,"context":{"location":{}},"selector":"#myForm"}

我读了一些人们使用.serializeArray（）的主题，但结果我得到了单个对象的数组

Answer 1

您正在对选择器$("#myForm");返回的表单jQuery对象进行字符串化。

.serializeArray()将以下列格式（名称，值对）

生成输出

[{"name":"login","value":"test"},{"name":"password","value":"test"}]

您可以修改.serializeArray()返回的输出。

var frm = $("#myForm");
var formData = frm.serializeArray();
var data = {};
$.map(formData, function (obj,i) {
    data[obj['name']] = obj['value'];
});

应用JSON.stringify()将产生：

{ “登录”： “测试”， “密码”： “测试”}

<强> Updated Fiddle

Answer 2

最简单的方法：

<强> JS

var login = $('#login').val();
var password = $('#password').val();

$("#myForm").submit(function(event) {

    $.ajax({
        url: "/register/",
        data: {'login':login,'password':password},
        type: "POST",
        success: function(data) {
            alert(data);
        }
    });
});

<强> PHP

$login = $_POST['login'];
$password = $_POST['password'];

echo 'login:' . $login . ' - password: ' . $password;

Answer 3

$("#myForm").submit(function(event) {
    var frm = $("#myForm");
    var data = frm.serialize();

    event.preventDefault();

    $.ajax({
        url: "/register/",
        data: JSON.stringify(data),
        type: "POST",
        contentType: "application/json"
    });
});

Answer 4

正如您自己指出的那样，您必须使用.serializeArray()。它返回名称和值的数组，您可以使用Array的方法将其转换为所需的格式。

这样的事情：

var data = {};
frm.serializeArray().forEach(function(el) {
    data[el.name] = el.value;
});
var json = JSON.stringify(data);

表单转换为错误的json格式

4 个答案: