使用Ajax方法检索数据时显示加载

Display loading while retrieving data using Ajax method

本文关键字：显示 加载 数据 检索 Ajax 方法 使用      更新时间：2023-09-26

我使用ajax，有时从数据库加载所有数据需要时间，因此我需要找到一种方法来显示(正在加载…(，而数据尚未完成。下面是我的示例代码，我正在寻找一些数据仍在处理中的事件。

$.ajax({
   type: "POST",
   url: "some.php",
   data: "name=John&location=Boston",
   success: function(data){
     $('#para').html(data);
   }
 });

这很简单。。

在调用ajax之前，先启动加载映像&成功后隐藏图像例如：

$.fancybox.showLoading();
$.ajax({
   type: "POST",
   url: "some.php",
   data: "name=John&location=Boston",
   success: function(data){
     $.fancybox.hideLoading();
     $('#para').html(data);
   }
});

此处

$.fancybox.showLoading((

是我的函数，在其中我具有显示加载程序的属性

每当进行ajax调用时，这将被内部调用。

$.ajaxStart(function() {
    $("img#loading").show();
});
$.ajaxComplete(function() {
    $("img#loading").hide();
});

HTML

<img src="../images/loading.gif" alt="wait" id="loading"/>

<div id="loading">LOADING...</div>
var loading = $("#loading");
loading.hide();
function doAjax() {
    loading.show();
    $.ajax({
        url: "/js/beautifier.js",
        success: function (data) {
            loading.hide();
        }
    });
}
doAjax();

在jsfiddle 上

相关文章：