Question

我需要在给定的AJAX请求发生时显示一个带有消息的微调器，并且应该保持在那里直到调用结束。我根本不关心来自通话的返回状态，因为我稍后会处理（以相同的代码），所以404,500,200或任何其他状态都是有效的。

目前我正在处理它：

$(document).bind("ajaxSend", function () {
    load_start('Please wait, we are processing data...');
}).bind("ajaxComplete", function () {
    load_end();
});

在上面的情况中，出于某种原因（可能是因为ajaxComplete解释了ajaxStop与ajaxComplete之间的差异 - 意味着$.ajax({ ... }).beforeSend(function () { load_start('Please wait, we are processing data...'); }).always(function(){ load_end(); });意味着AJAX调用已成功启动）调整器在调用完成之前停止，因为我看到它只是在Chrome Developer Toolbar上运行。

然后用户再次尝试再次单击相同的按钮，因为在页面上没有看到任何内容，并且他们不会去Dev开发工具栏查看AJAX调用是否仍在执行。

我以前用这种方式做过：

message.GetBody<string>()

但是我遇到了同样的问题。处理这个问题的正确方法是什么？如果有任何插件，我需要它随时推荐它。

Answer 1

更新：使用$.ajaxSetup https://jsfiddle.net/ewwink/vmm7Lqz8/

$.ajaxSetup({
  url: '/echo/html/',
  beforeSend: load_start,
  complete: load_end
});

你可以这样做，handleCallback将在请求完成后被调用

$('#button').on('click', function() {
  load_start('Please wait, we are processing data...');
  $.ajax({
    ....
    error: handleCallback,
    success: handleCallback
  });

});

function handleCallback(response, status, jqxhr) {
  ...
  load_end();
}

Answer 2

如果您想为多个AJAX请求执行此操作，而无需在每个请求中编写加载代码。你可以做如下所示的事情。

 //This is called when the first AJAX request is fired.
    $(document).ajaxStart(function(event, jqXHR) {
        //Show spinner
    });

    //This is called after all the AJAX request are stopped.
    $(document).ajaxStop(function(event, jqXHR) {
        //Hide spinner

    });

Answer 3

使用always()，尽管有非描述性方法命名，但如果您想等待ajax请求完成，则可以正常工作。

 }).always(function () {
      load_end();                             
 });

如何在AJAX请求完成之前正确运行微调器？

3 个答案: