如何显示ajax加载图像

我想显示ajax加载图像。 但不知道该怎么做。 这是我工作的ajax脚本。 请帮我集成ajax加载gif.thanks

$(function() { $( "#slider" ).slider({ stop: function(event, ui) { $.ajax({ url: "ajax.php", cache: false, async: false, data: "", success: function(html){ $("#result_list").html(html); } }); } }); }); 

Answer 1

 $(function() { $( "#slider" ).slider({ stop: function(event, ui) { $("#place_of_loading_image").show(); $.ajax({ url: "ajax.php", cache: false, async: false, data: "", success: function(html){ //got the data $("#place_of_loading_image").hide(); // hide ajax loader $("#result_list").html(html); // show downloaded content } }); } }); }); 

#place_of_loading_image是某个容器（如div ），在一个你想要loader.gif出现的地方。

Answer 2

你看过blockui吗？ http://jquery.malsup.com/block/

 $(function() { $( "#slider" ).slider({ stop: function(event, ui) { $.blockUI({ message: null }); //loading $.ajax({ url: "ajax.php", cache: false, async: false, data: "", success: function(html){ $.unblockUI(); //loading complete $("#result_list").html(html); } }); } }); }); 

Answer 3

Ajax有api ajax start和ajax stop，当ajax请求发送这个apis触发器时

  $(document).bind("ajaxStart.mine", function() { $("#image").html(""); }); $(document).bind("ajaxStop.mine", function() { $("#image").html(""); }); 

使用类显示和隐藏图像。

Answer 4

在开始XHR之前，请显示加载图像。

在XHR的成功回调中，隐藏加载图像。

Answer 5

这样的事情会有所帮助。

在您的function开始时：

 jQuery('#processing').html( '' ); $('#submit').attr("disabled", true); 

成功的一部分function：

 jQuery('#processing').html( '' ); $('#submit').attr("disabled", false); 

注意：

应该在您的HTML中，您可以使用css在页面的任何位置设置此DIV的位置。 并为这些提交按钮设置id='submit'以便在处理时将其设置为禁用…