Question

所以我一直在试用一些jQuery插件来帮助我在使用ajax获取内容时显示加载div / img，但是唉它一切都不成功，我使用的代码就是这样：

jQuery(document).ready(function($) {
        function load(num) {
            $('#pageContent').load(num +".html");
        }

        $.history.init(function(url) {
                load(url == "" ? "1" : url);
            });

        $('#bbon a').live('click', function(e) {
                var url = $(this).attr('href');
                url = url.replace(/^.*#/, '');
                $.history.load(url);
                return false;
            });
    });

我猜测可能有一种简单的方法来实现这样的代码，但是，我的页面大小相对较小（这就是为什么我要显示'loading'div / img）。

你认为我应该简单地预加载那个大页面的内容而不是使用其他插件或代码吗？

如果是，那么jquery中有内容的预加载吗？我知道有图像。

Answer 1

试试这个：

   function load(num) {
         $('#pageContent').html('<img ....') //some random image here
         $('#pageContent').load(num +".html");
     }

Answer 2

在尝试加载内容并让动画在load（）的回调中消失之前，您可以通过添加动画来完成正在尝试的内容。

jQuery(document).ready(function($) {
        function load(num) {
            $('#pageContent').load(num +".html", function() {
                $('#animation').hide();
        });
    }

    $.history.init(function(url) {
        load(url == "" ? "1" : url);
    });

    $('#bbon a').live('click', function(e) {
            $('#animation').show();
            var url = $(this).attr('href');
            url = url.replace(/^.*#/, '');
            $.history.load(url);
            return false;
        });
});

创建一个id =动画的图像或div，默认隐藏。

我如何显示“加载”动画？

2 个答案: