如何在调用服务器时使用javascript进行检查

Question

我正在调用google (在json中获取数千条记录)，将记录保存在数据库中，然后在下一页显示所有记录。我想显示加载gif直到下一页加载。我使用了jquery (请参阅下面的代码)，但它没有按需要工作，因为加载映像只有在下一页开始加载时才会显示，而div在下一页完成加载时会淡出。当调用google时，它不会显示出来。

<script>
    // Wait for window load
            $(window).load(function() {
                // Animate loader off screen
                $("#bg").fadeOut("slow");
                $("#imgLoading").fadeOut("slow");;
            });
</script> 

如果对服务器进行了调用，我如何使用JavaScript进行检查，以便显示加载gif。我不想在单击按钮时调用该函数，我希望它是通用的，因此当调用服务器显示加载图像时，在下一页完成加载时显示完成。

提前感谢你!！

Answer 1

解决办法:我有一个解决办法，我开始显示表单的加载图像onSubmit事件。在下一个页面上，开始显示相同的加载图像，直到页面完全加载。因此，当按钮被按下直到下一页完全加载时，开始加载图像。

Answer 2

如果您正在使用Jquery，那么我建议您看看这

这是尽可能容易的。

$( document ).ajaxSend(function() {
  $( ".log" ).text( "Triggered ajaxSend handler." );
});

Answer 3

遵循以下步骤：

将下面的div添加到开始标记.的下方。

<div class="loader"></div>

添加一些CSS

.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('images/page-loader.gif') 50% 50% no-repeat rgb(249,249,249);
}

添加jQuery和一行代码

<script type="text/javascript">
$(window).load(function() {
    $(".loader").fadeOut("slow");
})
</script>

注意：请确保jquery.min.js包含在您的文件中