如何显示AJAX加载GIF动画，而页面加载？ [英] How to show ajax loading gif animation while the page is loading?

问题描述

我试着在我的网站来实现AJAX。当点击DIV changepass的内容，那么它应该载入changepass.template.php。下面是使用了该code IM。

I try to implement AJAX in my website. When the content of the div changepass is clicked then it should load changepass.template.php. Here is the code im using for that.

 $(function() {
   $(".changepass").click(function() {
    $(".block1").load("views/changepass.template.php");
    return false;
 });

我的问题是如何显示GIF动画（loading.gif），而页面changepass.template.php被完全加载。给我一些code提示请。

My question is how to show GIF Animation (loading.gif) while the page changepass.template.php is fully loaded. Give me some code tips Please.

推荐答案

有很多方法来做到这一点。 一个简单的方法做：

There are many approaches to do this. A simple way to do:

<div style="display:none" id="dvloader"><img src="loading.gif" /></div>

JS：

$(function() {
    $(".changepass").click(function() {
        $("#dvloader").show();
        $(".block1").load("views/changepass.template.php", function(){ $("#dvloader").hide(); });
        return false;
    });
});

编辑的显示：块的到的显示（）的詹姆斯·怀斯曼建议后：）

Edited display:block to show() after suggestion from James Wiseman :)

这篇关于如何显示AJAX加载GIF动画，而页面加载？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！