Question

假设我的ajax调用调用了我的PHP函数来获得一些结果。

$('.ui-loader').show();
$.ajax({
        url: BASE_URL +'some_page.php',
        type: 'POST',
        datatype: 'json',
        async:false,
        success: function (response) {

             // response will get my result from "somepage.php"
             $('.ui-loader').hide();

        },
        error: function (jqXHR, textStatus, errorThrown) {
            //alert(jqXHR.status);
        }
    });

如果ajax响应需要时间来获得结果，我怎样才能显示另一个加载器，说明"Sorry it is taking time please wait"？

我遇到了ajaxStart()和ajaxStop()，但我怎么能在这里使用？请你们指导我实现这个目标。

注意： $('.ui-loader').show();是一个简单的加载程序我想要隐藏此加载程序并显示另一个表示“抱歉需要时间，请等待”。

提前致谢。

Answer 1

您可以使用setTimeout执行此操作，例如：

var longWaitTimerId = setTimeout(function () {
    //took longer than 5 seconds
}, 5000);

$.ajax({
    ...
    success: function (response) {
        clearTimeout(longWaitTimerId);
        ...
    },
    error: ... same as above
});

Answer 2

function MakeAjaxCall(){
//timer to show another loader
var timer = window.setTimeout(function(){
        $('.ui-loader').hide();
        $('.ui-AnotherLoader').show();
    }, 2000);
$('.ui-loader').show();
$.ajax({
    url: BASE_URL +'some_page.php',
    type: 'POST',
    datatype: 'json',
    async:false,
    success: function (response) {
          //clear the timer if ajax call take less time
          wiundow.clreatTimeout(timer);
         // response will get my result from "somepage.php"
         $('.ui-loader').hide();
         $('.ui-AnotherLoader').hide();
    },
    error: function (jqXHR, textStatus, errorThrown) {
        //alert(jqXHR.status);
    }
});
}

如果通话需要更长时间，如何在ajax上显示消息“抱歉需要时间加载”

2 个答案: