Question

我使用以下代码从服务器获取消息并将其打印到前端：

var message = getMessageFromServer();
$('.result').html(message);

function getMessageFromServer() {
    var result = null;

    $.ajax({
        url: 'index.php',
        type: 'GET',
        success: function (msg) {
            result = msg;
        }
    });

    return result;
}

它显然不起作用，因为随着javascript的工作，行return result在ajax完成之前就开始运行，因此我的函数getMessageFromServer总是返回null。

我整天都在搜索这个问题，并得到了很多答案，例如将async设置为false，完成时使用，回调，将代码重构为对ajax更友好的方法等。但是，我使用的是框架那不会让我自由地重组代码，所以我需要自己问一个问题：如何在以下条件下将消息打印到前端：

前两行不得更改，我需要将结果返回到message，以便可以将其打印到前端。
不使用async: false，因为它不利于用户体验。
我们可以创建更多方法，只要在函数getMessageFromServer

P / s：如果您想知道，我使用的框架是Magento，并且我尝试使用AJAX添加自定义验证规则，但是我的主要问题是javascript，因此我没有将其放入标签。

Answer 1

这是JS和异步回调的本质。代替分配var message = getMessageFromServer()，您应该在成功回调中设置$('.result')。


getMessageFromServer();

function getMessageFromServer() {

    $.ajax({
        url: 'index.php',
        type: 'GET',
        success: function (msg) {
            $('.result').html(msg);
        }
    });

    return result;
}

等到ajax完成后再返回函数

1 个答案: