如何在jquery.load进程中添加jquery load.gif？

Question

我想用use jQuery.load()来加载一些内容.如何在加载过程中添加微调器？

$("#content").load("b.php #abc");

Answer 1

假设您的页面上有一个隐藏的微调器:

<img src="/spinner.gif" id="spinner" alt="loading..." style="display: none;" />

您可以使用$ .ajaxSetup函数来设置全局选项.例如,你可以这样做:

$(function() {
    // set global ajax options:
    $.ajaxSetup({
        beforeSend: function(xhr, status) {
            // TODO: show spinner
            $('#spinner').show();
        },
        complete: function() {
            // TODO: hide spinner
            $('#spinner').hide();
        }
    });

    $('#foo').click(function() {
        // because we have overriden the global AJAX settings
        // the spinner will be shown during the request
        $('#content').load('b.php #abc');
    });
});

现在,无论何时使用jQuery为此目的提供的方法之一发出AJAX请求,如spinner将在请求之前显示,并在请求完成后隐藏(成功或错误).

Answer 2

 $("#content").html("<img src='/images/load.gif' alt='loading...' />");
 $("#content").load("b.php #abc");