刷新多个 iframe

Question

我有一个包含多个 iframe 的页面。 iframe 正在从安全摄像头中抓取 jpeg 图像。我希望 iframe 每 7 秒刷新一次，但在 40 次刷新后超时。我正在为我的计数器使用会话存储。这是我到目前为止所构建的。但是 iframe 不刷新。

<title>Oak Sec Cams (low-rez)</title>
<center><font color ="blue"> Oakland Security Cams (<b>Medium</b> / <a  href="tiny.html">Small</a>)</center>
<script type="text/javascript">

var intervalID = 0;

var iframes = document.getElementsByTagName("iframe");

function windowOnInitialize()
{
intervalID = setInterval(reloadiframes, 7000);
window.sessionStorage.setItem("intervalID", intervalID); 
//alert("we were called");
}

var counter = 0;

function reloadiframes()
{ 
var refreshCounter = window.sessionStorage.getItem("counter");
//alert(refreshCounter);
if (refreshCounter < 40)
{
    refreshCounter++;
    window.sessionStorage.setItem("counter", refreshCounter);
    location.reload();
    //alert(counter);


}
else
{

  clearInterval(intervalID);
window.sessionStorage.clear();

}
}

</script>

Answer 1

因此，您的 iframe 没有每 7 秒刷新一次的原因是您实际上并未在代码中的任何位置调用该函数。

function windowOnInitialize() {
  intervalID = setInterval(reloadiframes, 7000);
  window.sessionStorage.setItem("intervalID", intervalID); 
}

虽然您已经定义了 windowOnInitialize 函数，但您需要将此行添加到脚本的底部

windowOnInitialize()

此外，由于使用了“location.reload();”，重新加载 iframe 功能将无法工作。它将重新加载当前文档，在这种情况下，它是 iframe 的持有者。您需要的是对 iframe 元素的某种迭代，这些元素将单独重新加载每个元素。 希望这能让你走上正确的道路：

 function reloadiframes() {
    var refreshCounter = window.sessionStorage.getItem("counter");
    if (refreshCounter < 40) {
        refreshCounter++;
        window.sessionStorage.setItem("counter", refreshCounter);
        for (var i = 0; i < iframes.length; i++) {
           iframes[i].src = iframes[i].src ; 
        }
    }
    else {
        clearInterval(intervalID);
        window.sessionStorage.clear();
    }
}
windowOnInitialize()