Question

这是我在尝试展示“装载机”的地方的代码片段。 GIF。我在我的localhost上测试并且工作正常。但是现在有一点观察我不知道它是否真的显示了gif，而php从SQL数据库或其他方式提取数据。

我的观察是，当我清除浏览器缓存并刷新页面时，我看到浏览器的加载器图像在我的页面加载器加载之前转了几圈。我错过了什么吗？

PS：我所拥有的加载程序gif显然是一个非常轻的文件。

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
    <script>
        $(document).ready(function () {
            $(document).ajaxStart(function () {
                $("#wait").css("display", "block");
            });
            $(document).ajaxComplete(function () {
                $("#wait").css("display", "none");
            });
            $("#text").load("example.php");
        });
    </script>
</head>

<body>
    <button>Change Content</button>
    <div id="wait" style="display:none;"><img src="../images/loader.gif"></div>
    <div id="text"></div>
</body>

</html>

Answer 1

在开发过程中测试ajax调用中使用的加载程序映像的一种好方法是在您调用的脚本中引入一个人工延迟。

usleep(3000);

这将使脚本休眠3秒，模拟相当大的网络延迟，让您直观地看到正在运行的加载程序图像。

与浏览器的加载程序映像相比，加载程序gif延迟

1 个答案: