jquery - 使用 jquery ajax 在 asp 中加载内容时显示加载消息

Question

在我的 asp 站点中，我试图在页面加载时从 Active Directory 中获取用户详细信息。我喜欢显示“loading.gif”图像，直到我得到详细信息。可以帮助我，因为我是 jquery 的新手

Answer 1

你可以这样做：

$(function(){
    $('body').addClass('loading');
    $(window).load(function(){
      $('body').removeClass('loading');
      $('#wrapper').show(); // make display:none in the css.
    });
});

如果您使用的是 ajax，那么您可以使用.ajaxStart()and.ajaxComplete()

把它放在ajax调用之前：

$('#yourElem').ajaxStart(function() {
   $(this).addClass('loading');
});

将其放在 ajax Call 之后：

$('#yourElem').ajaxComplete(function() {
   $(this).removeClass('loading');
});

Answer 2

AJAX 的简单形式.get()应该足以满足您的需求。

首先，在您的 HTML 中添加一个占位符，其中将显示加载图像，然后当您加载内容时，将放置这些内容而不是图像。

例如：

<div id="ContentsPlaceholder"></div>

jQuery 代码现在是：

$(function() {
    $("#ContentsPlaceholder").html("<img src='Loading.gif' />");
    $.get("GetData.asp", function(contents) {
        $("#ContentsPlaceholder").html(contents);
    });
});

这会将“Loading.gif”图像放在占位符中，然后从名为“GetData.asp”的页面加载数据，当数据可用时，它将放置它而不是图像。