如何处理来自服务器的 jQuery .ajax 响应答案

【问题标题】：How do I handle jQuery .ajax responses from server如何处理来自服务器的 jQuery .ajax 响应
【发布时间】：2011-09-13 00:48:05
【问题描述】：

我试图弄清楚如何使用 ajax / 查询处理来自服务器的响应（服务器返回真或假（json 编码））：

function submitFormWithAjax(form) {
    form = $(form);

    $.ajax({
        url: form.attr('action'),
        data: form.serialize(),
        type: (form.attr('method')),
        dataType: 'json'
    });

    var serverResponse = eval(result.responseText);
    console.log(serverResponse);
    return serverResponse;
}

现在，当我在控制台记录结果时，属性 responseText 正确显示为真/假，但该函数似乎总是返回真。我不是 javascript / jquery 程序员，所以如果我在上面做的事情看起来很“愚蠢”，请原谅我，我正在尝试将事情拼凑起来。

--更正，函数总是返回false（不是我上面说的true）

【问题讨论】：

标签： jquery ajax forms

【解决方案1】：

function submitFormWithAjax(form) {
    var form = $(form);
    var ret = false;
    $.ajax({
        url: form.attr('action'),
        data: form.serialize(),
        type: (form.attr('method')),
        datatype: 'json',
        success: function( data, status, xhttp) {
             // data will be true or false if you returned a json bool
             ret = data;
        },
        async: false // this is generally bad, it will lock up your browser while it returns, but the only way to fit it into your pattern.
    });
    return ret;
}

还有一个插件可以为您完成一些工作：
http://jquery.malsup.com/form/

哦，另外，请注意您的属性和值名称的大小写。我认为“dataType”需要是“datatype”

我不喜欢这个解决方案，但它可以让你到达你需要的地方。我认为您需要进行一些重构以使其异步正常工作。

【讨论】：

好的，调整了我的代码（添加了成功部分），但是，也许我误解了正在发生的事情，因为警报和控制台日志都正确显示真/假（布尔不是字符串），但是函数 submitFormWithAjax(form)，是我需要“返回”结果的地方，我认为这就是它失败的地方（总是返回 false）
啊，我明白了。我想你可以同步进行ajax调用，虽然不是最好的解决方案......我会更新代码......
好的，如果我们必须为此解决方案关闭异步，也许我最好修改一下我的问题。这是我想要做的：我的服务器上有一个表单（Zend_Form），它加载到客户端的模式对话框中，并通过点击事件（jquery）提交表单。最终我想要的是如果表单提交成功（基于服务器响应）我希望对话框关闭，否则我希望它在对话框中重新显示表单（有错误）
我将把它标记为正确，因为它现在仍然返回正确的值。但是任何关于如何更好地实现我在上一个问题中的目标的建议/教程链接都会很棒（不使用 async: false）

【解决方案2】：

这可能更接近正确的做法......

$("#SomeButtonThatOpensDialog").click(function()
{
    $("#ElementWithForm").dialog({
        // dialog options here
        buttons: {
            Submit: function() {
                $.ajax({
                    // ajax options
                    success: function(data, status, xhttp)
                    {     
                        if ( data )
                        {
                          // if true
                          $("#ElementWithForm").dialog("destroy");
                        }
                        else 
                    { // if false, show some sort of message with errors
                            alert("OH NO!");
                        }                      
                    }
                });
            }
        }
    })
});

【讨论】：

啊，是的，我了解那里的处理逻辑，甚至可以更好地简化事情。谢谢！
将正确答案更改为这个，因为它可以帮助我更轻松地处理事情。

【解决方案3】：

我怀疑您返回的字符串看起来像一个布尔值。如果将 result.responseText 记录到console.log(result.responseText) 之类的控制台，它会是什么样子？是否包含引号？

如果我是对的，你可能想做这样的事情：var serverResponse = $.parseJSON($.parseJSON(result.responseText))

如果它是一个字符串，并且您可以将其更改为不是字符串，您应该这样做并使用 Darthg8r 的答案。

【讨论】：

是的，它是布尔值（不是字符串），每个 cmets（请参阅@Darthg8r cmets 区域）看起来更像是函数的问题，而不是我认为内部的 ajax 调用。