javascript - 我的ajax完成后如何显示我的加载图标

Question

我有一个像这样的简单 javascript 函数:

function showHint() {
    var xmlhttp = new XMLHttpRequest();

    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {

            //extract data here

        }
    }

    xmlhttp.open("GET", "articles.php?q=" + cat + "&year1=" + start_year + "&year2=" + end_year, true);

    xmlhttp.send();

}

我希望能够在 ajax 完成后显示我的加载图标。我在我的 js 的最开头显示我的加载图标:

$.mobile.loading("show");

很好地显示了图标(使用 jquery mobile)。但是，我只需要在 ajax 完全完成后隐藏图标。我试过像这样在 jQuery 中使用 .done()，但我认为我没有正确使用它:

xmlhttp.onreadystatechange.done(function(){
    $.mobile.loading("hide");
});

Answer 1

需要使用onreadystatechange回调函数。

xmlhttp.onreadystatechange = function () {
    if (xmlhttp.readyState == 4) {
         $.mobile.loading("hide");
    }
}

因为您已经在使用 jquery .您可以简单地使用 jQuery.get()喜欢

$.mobile.loading("show");
$.get("articles.php?q=" + cat + "&year1=" + start_year + "&year2=" + end_year, function(data) {
    //Do something
}).done(function() {
    $.mobile.loading("hide");
});