使用jQuery发送JSON数据

Nei*_*ir0 69 javascript ajax jquery

为什么下面的代码发送数据City=Moscow&Age=25而不是JSON格式?

var arr = {City:'Moscow', Age:25};
$.ajax(
   {
        url: "Ajax.ashx",
        type: "POST",
        data: arr,
        dataType: 'json',
        async: false,
        success: function(msg) {
            alert(msg);
        }
    }
);
Run Code Online (Sandbox Code Playgroud)

Dar*_*rov 174

因为您既未指定请求内容类型,也未指定JSON请求.以下是发送JSON请求的正确方法:

var arr = { City: 'Moscow', Age: 25 };
$.ajax({
    url: 'Ajax.ashx',
    type: 'POST',
    data: JSON.stringify(arr),
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    async: false,
    success: function(msg) {
        alert(msg);
    }
});
Run Code Online (Sandbox Code Playgroud)

需要注意的事项:

  • 使用该JSON.stringify方法将javascript对象转换为JSON字符串,该字符串是本机和内置的现代浏览器.如果要支持旧版浏览器,可能需要包含json2.js
  • 使用contentType属性指定请求内容类型,以便向服务器指示发送JSON请求的意图
  • dataType: 'json'属性用于您期望从服务器响应的类型.jQuery足够聪明,可以从服务器响应头中猜出来Content-Type.因此,如果您的Web服务器或多或少地尊重HTTP协议并响应Content-Type: application/json您的请求,jQuery将自动将响应解析为javascript对象到success回调中,这样您就不需要指定该dataType属性.

需要注意的事项:

  • 你所说arr不是数组.它是一个带有属性(CityAge)的javascript对象.数组用[]javascript 表示.例如,[{ City: 'Moscow', Age: 25 }, { City: 'Paris', Age: 30 }]是一个包含2个对象的数组.


lon*_*day 9

因为默认情况下jQuery序列化作为data参数传递的对象$.ajax.它用于$.param将数据转换为查询字符串.

来自jQuery文档$.ajax:

[ data参数]转换为查询字符串,如果不是字符串

如果你想发送JSON,你必须自己编码:

data: JSON.stringify(arr);
Run Code Online (Sandbox Code Playgroud)

请注意,JSON.stringify它仅出现在现代浏览器中.有关遗留支持,请查看json2.js