如何使用加载图像显示刷新 iframe url答案

【问题标题】：How to refresh the Iframe url with Loading Image display如何使用加载图像显示刷新 iframe url
【发布时间】：2011-10-01 20:05:06
【问题描述】：

我想要为加载其源页面的 I-Frame 制作动画。我通过使用 JavaScript 代码部分实现了我的目标，如下所示

function reloadIt()
{
    frm=document.getElementsByName("pagers")[0];      //we get the iframe object
    frm.src=frm.src;        //or you can set the src to a new src
    setTimeout("reloadIt()",100000);         //the function will run every 60000 miliseconds, or 60 seconds
}

我的 HTML 正文代码放在这里

<body onload="reloadIt()">

我的 IFRAME 代码是这样的

<div id="divLoading">
    <div style="width:100%; height:200px; align="center"> 
        <img src="loader.gif" alt="" align="absmiddle"/> 
    </div>
</div>
<div id="divFrameHolder" style="display:none">
    <iframe  src="lead.php" height="450px;" width="100%"  name="pagers"  onload="hideLoading()" > </iframe>`
</div>

当这个 html 页面第一次加载时效果很好，我们可以看到在 Iframe 中加载图像，直到它的源页面加载。但是在 IFrame 刷新的时间间隔之后，没有加载图像，它只是重新加载它的源页面......任何人都可以帮助我吗？？

【问题讨论】：

标签： javascript html iframe javascript-events

【解决方案1】：

你可以看看 BlockUi，一个 jquery 插件。（http://jquery.malsup.com/block/#element）。试试这样的：

function reloadIt() {
       $("#iframeholder").block({
            message: '<img src="css/ajax-loader.gif"/>',
            css: { width: "600px;", height: "400px;" }
        });
        $('#pagers').attr('src', $('#pagers').attr("src"));
        $('#iframeholder').unblock()
        setTimeout("reloadIt()", 5000);
}

【讨论】：