Question

如何在iframe中显示“正在加载页面”消息（使用jquery），以便最终用户在实际页面尝试加载时不查看空白页？

Answer 1

我建议您不要使用iframe，而是在身体顶部制作绝对或固定定位的div（甚至覆盖整个屏幕）和消息。然后，在$（document）.ready function add

中

$("div#myMessageDivID").remove();

示例：

<body>
<div id="loadingMessage" style="position:fixed; background:white; top:0px; left:0px; right:0px; bottom:0px;" >
<div style="position:relative; width:10%; left:45%; top:45%; color:black;">
Please wait, loading...
</div>
</div>
...
</body>

<script type="text/javascript>
jQuery(document).ready(function(){
    $("div#loadingMessage").remove();
});
</script>

如果您的邮件提前删除，或者使用setTimeout推迟删除，您也可以使用$（正文）.ready而不是$（文档）。

Answer 2

这是解决上述问题的最简单方法。

将以下代码放在脚本标记内的页面头部：

function hideProgress(){ 
    document.getElementById('loader').style.display = 'none'; 
}

将以下代码放在iframe代码中：

onload="hideProgress()"

如下所示放置短信：请插入＆lt;＆gt;必要的地方。
div页面加载。请稍候... iframe / iframe / div

可以使用img标签将文本消息替换为图像。

如果上述内容不明确，如果您需要更多参数，如宽度，高度，字体大小，字体颜色，背景颜色等，请尝试以下操作。

获取适用于所有主流浏览器的一行代码：
http://www.abyzco.in/jokes/jokes-codes.html

我已将此代码放在我的博客上，您可以在以下位置验证：
http://www.modest-jokes.blogspot.in

使用jquery在iframe中加载页面消息

2 个答案: