Question

我有一个javascript文件，它对服务器上的php文件进行AJAX调用，返回JSON编码数据。 PHP文件可以返回成功或失败，具体取决于十几种不同的消息，如：

if ( something here ) {
    if( something else here ) {
        if( more tests here ) {
            $response['success'] = 'Successfully did something.';
        } else {
            $response['success'] = 'Successfully made this work';
        }
    } else {
        $response['error'] = 'Failed to make the donuts.';  
    }
} else {
    $response['error'] = 'I need more information!';
}
echo json_encode($response);
exit;

我在前端有javascript / jquery，它检查响应失败情况并显示警告框并执行一些其他相关操作。

$.post(ajaxurl, data, function(response) {
    if( response.hasOwnProperty("success") ) {
        if( $(this).is( ":checked" ) ) {
            $(this).removeAttr( "checked" );
        } else {
            $(this).attr( "checked", "true" );
        }
        alert( response["success"] );
    } else {
        alert( "Sorry, something went wrong.  \nError: " + response["error"] );
    }
});

问题在于，无论我如何检查成功条件，它始终会显示response['error'] undefined typeOf response['success'] != "undefined"我尝试过{ "success", "Successfully did something." }测试的错误消息其他方法来查看成功值是否已设置但似乎没有任何效果。我得到一个响应，当我在console.log时看起来像这样：{{1}}我在阅读消息时做错了什么？

Answer 1

使用前需要parse JSON响应，

$.post(ajaxurl, data, function(response) {
    var response=JSON.parse(response);
    //then your code
});

或

您可以在AJAX调用中将数据类型属性用作json，如：

$.post(ajaxurl, data, function(response) { //your code }, "json");

Answer 2

只需在最后添加数据类型即可编辑JavaScript代码（请参阅以下代码段中的最后一个参数）请参考 https://api.jquery.com/jQuery.post/

$.post(ajaxurl, data, function(response) {
    if( response.hasOwnProperty("success") ) {
        if( $(this).is( ":checked" ) ) {
            $(this).removeAttr( "checked" );
        } else {
            $(this).attr( "checked", "true" );
        }
        alert( response["success"] );
    } else {
        alert( "Sorry, something went wrong.  \nError: " + response["error"] );
    }
},'json');

Answer 3

嗯，上面的人给出了答案，但我在你的代码中又发现了一个问题：

我想这个post语句是在复选框的事件处理程序中调用的，你想在响应后修改这个复选框的状态。但this对象不再是post回调函数中的复选框，而是post对象。因此，您会发现您的代码不会像您预期的那样在响应后更改复选框的状态。

您可以像这样修改您的代码：

var $ele = $(this);
$.post(url, data, function() {
...
if( $(this).is( ":checked" ) ) {
            $ele.removeAttr( "checked" );
        } else {
            $ele.attr( "checked", "true" );
        }
...
}, "json");

修改

好吧，上面的代码不够优雅，不足以引入不必要的局部变量，回调函数必须将父函数的局部变量保存在内存中（作为闭包的结果），因此以下是更好的选择：

$.post(url, data, $.proxy(function() { ... //use "this" object just like the original code of author ... }, this), "json");

Answer 4

在ajax调用中使用dataType参数并将其设置为json。顺便说一句，你可以这样做：

alert( response.success );

由于来自ajax调用的返回对象或“data”回调参数实际上是一个json对象，而不是数组。

Javascript从AJAX响应中读取JSON结果

4 个答案: