等待 ajax 返回的正确方法(我不想使用成功处理程序

Correct way to wait for ajax to return (I don't want to use the success handler.)

本文关键字:我不想 成功 程序 处理 方法 返回 ajax 等待      更新时间:2023-09-26

可能的重复项:
如何让 jQuery 执行同步而不是异步的 AJAX 请求?
如何等待 AJAX 调用返回

听我说。 我完全理解这个代码段。

$.getJSON(someURL, function(data){
    //do something with my data
})
.success(function () {
    //Call what you want on success
})

如果我只需要采取一个非常静态的操作,这似乎很好。 但是,如果我想减少限制怎么办,例如这个

function my_func(){
    $.getJSON(someURL, function(data){
        //do something with my data... like modify an array or the dom
    })
}

现在的驱动程序

my_func();
//Now I want to call a function that relies on the data that my_func brought into the script.

如果我想这样做,我编写脚本的方式有问题吗? 还是我只是缺少一些很棒的内置方法?

我看到了两种可能的jQuery式方法。

第一种是使用另一个可以传递给my_func的回调:

function my_func(callback) {
    $.getJSON(someUrl, function(data) {
        // ...do stuff ...
        if ($.isFunction(callback)) { callback(data); }
    });
}
my_func(function(data) {
    // ..do more stuff..
});

第二种方法是创建一个自定义事件,该事件在my_func内部触发,可以从外部侦听:

function my_func() {
    $.getJSON(someUrl, function(data) {
        $(document).triggerHandler('my_func:data-received', [data]);
    });
}
$(document).on('my_func:data-received', function(event, data) {
    // ...do stuff...
});
my_func();

我强烈建议仅在绝对必要时使用async: false


处理这个问题的另一种(非常简洁的(方法是jQuery.Deferred对象:

function my_func() {
    var d = new $.Deferred();
    $.getJSON(someUrl, function(data) {
        d.resolve(data);
    });
    return d;
}
my_func().done(function(data) {
    // ...do stuff...
});

您的函数返回一个允许注册回调的对象。在函数中,您只需确保调用resolve来调用所有已注册的done回调处理程序。

然后是XHR对象:

var jqXHR = $.getJSON(someURL);

定义后,您可以在任何位置访问它:

jqXHR.always(function() {
    alert('JSON IS COMLETE');
});
jqXHR.done(function(data) {
    //do something with the returned data if success!
});
jqXHR.fail(function(jqXHR, textStatus) {
    alert('JSON FAILED : '+textStatus);
});

小提琴

你甚至可以做这样的事情:

$("#button").on('click', Myfunc);
function Myfunc() {
    var jqXHR = runAjax();
        jqXHR.done(function(data) {
            alert($.parseJSON(data));
            $("#result").html('JSON IS DONE');
        });
}
function runAjax() {
    return $.getJSON(someURL);
}

小提琴

您可能会

将在数据上运行的函数传递给my_func()

 //                    v--------receive a callback
function my_func(callback_fn){
    $.getJSON(someURL, callback_fn); // use the callback as the getJSON callback
}

然后。。。

my_func(function(data) {
    // do something with data
})

。或者,如果您要调用的函数是命名函数,那么您当然会按名称传递它......

my_func(someOtherFunction)

无论哪种方式,my_func()函数都将使用它作为$.getJSON调用的回调,该调用将在数据到达时调用它。