Javascript Php加载时预加载

我想在使用ajax加载php文件时添加一个预加载程序。可以使用jquery吗？谢谢。

启动请求时，您可以添加加载内容。使用

complete

回调函数，您可以删除正在加载的内容。这很简单。这里有一个例子

function loadSomething(url) {
    showLoading();

    $.ajax(url).complete(function(data) {
        hideLoading();

        console.log(data);
    });
}

---

其中

showLoading（）

和

hideLoading（）

分别管理预加载程序。

您可以使用jQuery.ajax的参数来实现这一点；将预加载内容设置为标记，并使CSS在默认情况下隐藏它，但在添加类时让它显示出来

例如，假设我们有一个div，它是我们的预加载程序。在它里面我们有一条信息说“正在加载”。CSS3将允许我们自动设置从class.preload到.preload.show的更改动画，然后我们所要做的就是从保持器中添加和删除这些类

这将是标记：

<div class="preloader">
    <h1>Loading...</h1>
</div>​

​ 最后是javascript：

$(function() {
    $.ajax({
        url: 'http://code.jquery.com/jquery-latest.js',
        dataType: 'script',
        beforeSend: function(evt) {
            if ( ! $('.preloader').is('.show') ) $('.preloader').addClass('show');
        },
        complete: function(jqXHR, textStatus) {
            // disable either here or at the end
            $('.preloader').removeClass('show');

            // handle error and success
        }
});

}))； ​

我为您上传了这个@JSFiddle示例，源代码如下：

下面是它的样子：

---

告诉我事情进展如何！XD

哇。谢谢你的回复！我现在就试试这个！

$(function() {
    $.ajax({
        url: 'http://code.jquery.com/jquery-latest.js',
        dataType: 'script',
        beforeSend: function(evt) {
            if ( ! $('.preloader').is('.show') ) $('.preloader').addClass('show');
        },
        complete: function(jqXHR, textStatus) {
            // disable either here or at the end
            $('.preloader').removeClass('show');

            // handle error and success
        }
});