在页面刷新时显示加载图像

Question

我有一个 javascript 片段，一旦有人单击特定链接，就会使用 .reload(true) 强制页面重新加载。 如何在页面刷新时显示简单的“加载”图像？

（如果有帮助的话，已经在页面上使用jquery）

Answer 1

查看 jquery-loadmask 插件

Answer 2

您没有指定加载图像的位置。 如果您希望图像本身“成为”加载图像，请首先按如下方式装饰图像：

<img class="cl"
     src="loading.gif"
     onload="if(!this._done){this._done=true;this.src='real.jpg';}"/>

然后，在调用 .reload 之前，执行以下操作：

$('img.cl').attr('src','loading.gif');

另一方面，如果您想将其放入固定位置，只需这样做，但将该 div 标记为隐藏，如下所示：（

<div id="rl">loading <img src="loading.gif"/></div>
<noscript><style>
#rl {display:none;}
</style></noscript>
<script><!--
document.write("<style>\ndiv#rl {display:block;}\n</style>");
$('#rl').hide();
//--></script>

也许您还将 rl 定位在某个地方）

然后，在调用 reload 之前，只需重新显示它：

$('#rl').show();