在AJAX请求期间显示微调框？

Question

展示微调器的最佳方式是什么？

我已经准备好了一个div（id =“spinner”），它应该在加载时可见。

Answer 1

你使用jQuery吗？

如果是这样，你可以使用：

ajaxStart & ajaxStop：http://docs.jquery.com/Ajax

例如：

$(function(){ 

    // hide it first 
    $("#spinner").hide(); 

    // when an ajax request starts, show spinner 
    $.ajaxStart(function(){ 
     $("#spinner").show(); 
    }); 

    // when an ajax request complets, hide spinner  
    $.ajaxStop(function(){ 
     $("#spinner").hide(); 
    }); 
}); 

您可以微调一点与请求计数器的递增和递减的情况下，你有很多同时请求。

如果您不使用jQuery，请查看jQuery源代码，其中的ajaxStart事件实际上是在普通的旧javascript中注册的。

HTH 亚历

Answer 2

$().ajaxSend(function(r, s) { 
    $("#spinner").show(); 
}); 

$().ajaxStop(function(r, s) { 
    $("#spinner").fadeOut("fast"); 
}); 

Answer 3

我在Rails应用程序中使用此。这对我有效：

$(document).ajaxSend(function(r, s) { 
$("#spinner").show();}); 


$(document).ajaxStop(function(r, s) { 
$("#spinner").fadeOut("fast");});