使用 jQuery POST 函数从服务器返回 JSON 数据答案

【问题标题】：Returning JSON data using jQuery POST function from server使用 jQuery POST 函数从服务器返回 JSON 数据
【发布时间】：2012-10-10 09:55:09
【问题描述】：

我正在尝试从 PHP 脚本返回一个 json 编码的字符串。

$.post("order.php", { product: product_id, coupon: coupon },
function(data) {
    $("#price").html("$" + data.price);
    $("#discount").html("$" + data.discount);
    $("#total").html("$" + data.total);
});

我尝试在回调中使用 alert 函数来查看 PHP 的返回值：

{"price":249,"discount":"0.00","total":249}

但#price 和其余元素的值是“$undefined”。

请帮忙。

【问题讨论】：

标签： jquery ajax json post get

【解决方案1】：

看来您只需使用 parseJSON() 将 JSON 数据解析为对象即可：

$.post("order.php", { product: product_id, coupon: coupon },
function(data) {
    data = $.parseJSON( data );
    $("#price").html("$" + data.price);
    $("#discount").html("$" + data.discount);
    $("#total").html("$" + data.total);
});

【讨论】：

【解决方案2】：

我知道这是旧的，但这是为了帮助所有可能遇到此问题的人

您必须向$.post 方法调用添加一个额外的参数（'json'），如下所示：

$.post(url,data_in,function(data_out){ your_code here },'json');

对于那些不知道的人，您的PHP 必须在所有处理结束时输出如下内容：

die(json_encode(array("RESPONSE"=>"OK","MYMESSAGE"=>"THIS IS SUCCESSFULL")));

还有HTML 输出替代JSON：

$.post(url,data_in,function(data_out){ your_code here },'html');

那么你的回复PHP 必须输出这个：

echo "<div id=\"RESPONSE\">OK</div>";   
echo "<div id=\"MYMESSAGE\">THIS IS SUCCESSFULL</div>";
die();

所以要回答原始问题，code 必须是这样的：

$.post("order.php", { product: product_id, coupon: coupon }, function(data) {
    $("#price").html("$" + data.price);
    $("#discount").html("$" + data.discount);
    $("#total").html("$" + data.total);
},'json');

【讨论】：

【解决方案3】：

你正在从你的服务器获取字符串，你应该将它解析为 json

使用

$.post("order.php", { product: product_id, coupon: coupon },
function(data) {
    data = jQuery.parseJSON( data );
    $("#price").html("$" + data.price);
    $("#discount").html("$" + data.discount);
    $("#total").html("$" + data.total);
});

【讨论】：

【解决方案4】：

您可以简单地使用下面的脚本，只需删除 $array 并将其替换为您想要的返回：

前两个标头阻止浏览器缓存响应（IE 和 GET 请求的问题）第三个为 JSON 设置正确的 MIME 类型。

假设这是 order.php 文件的内容：

开始脚本

header('Cache-Control: no-cache, must-revalidate');
header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
header('Content-type: application/json');

$array = array("price"=>10,"product_id"=>1);
echo json_encode($array);

结束脚本

并与：

$.post("order.php",function(data){
alert(data.price);
});

我们将获得 10 个就是这样，很简单:)

【讨论】：

【解决方案5】：

您应该使用 $.getJSON 而不是 $.post 来获取 json 字符串。

不要忘记将您的内容标头设置为 JSON

【讨论】：

根据 jQuery 文档 getJSON() 使用 GET 请求。 OP 希望使用 POST 请求。