避免在jQuery中使用async：false的策略？

jQuery docs强烈建议您在执行$.ajax请求时不要将async设置为false.

但是,我看到常见的solutions同步性问题涉及到这样做.然后我看到人们因为反对文档的推荐而被chastised.

话虽如此,我试图使用promise来避免使用async：false而没有运气.

这是我正在使用的代码.我有一个调用addToOrder的onclick事件：

function saveTemplate() {
    var formData = getFormData();
    return $.ajax({
        type: "POST",url: "/p/session/save/" + sessionid + "/template/PHP echo $templateID ?>/",data: formData,async: true,success: function(msg){
            var rsp = $.parseJSON(msg);
            if (rsp.response === 'Saved') {
                sessionid = rsp.sessionid;
                $("#save-preview-data-response").html("   " + rsp.response).fadeIn(100).delay(1000).fadeOut(1000);
            } else {
                $("#save-preview-data-response").css('color','#ff0000').html("   " + rsp.response).fadeIn(100).delay(1000).fadeOut(1000);
            }
        }
    });
}

function addToOrder() {
    var saved = saveTemplate();
    var issaved;
    saved.success(function(e) {
        var rsp = $.parseJSON(e);
        issaved = (rsp.response == 'Saved') ? true : false;
    });
    if(issaved) {
        $.ajax({
            type: "POST",url: "PHP echo $baseURL; ?>addToOrder/respond/json",data: "sid=" + sessionid,success: function(msg){
                var rsp = $.parseJSON(msg);
                if (rsp.response === 'Saved') {
                    alert(msg);
                }
            }
        });
    }
}

issaved将始终评估为false,因为在saveTemplate有时间运行之前正在评估它.我找到的唯一解决方案是设置async：false但是我正在接受我看到的严重警告而不愿意.还有哪些其他解决方案？

最佳答案

Tactics to avoid using async:false with jQuery?

学会爱回调. :-)当人们这样做时：

// The synchronous way
function doSomething() {
    var foo;
    $.ajax({
        url: "/the/url",async: false,success: function(response) {
            foo = response.foo;
        }
    });
    return foo;
}

// ...somewhere else,we use it
function flurgle() {
    var bar = /* go get `bar` from somewhere */;
    var x = 52;

    if (doSomething() === bar) {
        x -= 10;
    }
    niftyFunctionUsing(x);
}

…事件驱动的异步方式真的没那么大不同：

// The asynchronous way
function doSomething(callback) {
    $.ajax({
        url: "/the/url",success: function(response) {
            callback(response.foo);
        }
    });
}

// ...somewhere else,we use it
function flurgle() {
    var bar = /* go get `bar` from somewhere */;
    var x = 52;

    doSomething(function(foo) {
        if (foo === bar) {
            x -= 10;
        }
        niftyFunctionUsing(x);
    });
}

由于回调经常涉及闭包(上面的那些,我们正在访问x和bar的方式),我的博客中的这篇文章可能会有所帮助：Closures are not complicated

原文地址：https://www.jb51.cc/jquery/428708.html