刷新 iframe 而不刷新整个页面

Posted 2023-02-22

【中文标题】刷新 iframe 而不刷新整个页面

【英文标题】：Refresh an iframe without refreshing the entire page

【发布时间】：2014-03-23 03:06:05

【问题描述】：

我有一个 iframe，我想在不刷新整个页面的情况下自动刷新它。我更喜欢使用 javascript 或 jquery。这是我一直在尝试的，但没有成功。

<div class="Widget"><!--DARK SKY-->
    <div class="WidgetHeader">
        <img src = "images/WidgetHeaders/DarkSky.png"></div>
    <div id="DarkSky" style="width: auto; height: 245px; padding: 5px; background-color: hsla(0,0%,100%,.9);">
        <iframe id="forecast_embed" type="text/html" frameborder="0"   src="http://forecast.io/embed/#lat=38.269571&lon=-85.487420&name=Louisville&units=us&color=#4c7cba"> </iframe>
    </div>   
</div>

<script type = "text/javascript">
    window.onload = function()    
        setInterval(function refreshDarkSky()   
            document.getElementById("#forecast_embed").src ="http://forecast.io/embed/#lat=38.269571&lon=-85.487420&name=Louisville&units=us&color=#4c7cba"
        , 90000);
     
</script>

【参考方案1】：

如果 iframe 不是来自不同的域，您可以使用：

document.getElementById('forecast_embed').contentDocument.location.reload(true);

对于跨域，

var iframe = document.getElementById('forecast_embed');
iframe.src = iframe.src;

【参考方案2】：

试试这个代码

$(document).ready(function () 
            setInterval(function refreshDarkSky() 
                $("#forecast_embed").attr("src","http://forecast.io/embed/#lat=38.269571&lon=-85.487420&name=Louisville&units=us&color=#4c7cba"); 
            , 90000);
        );

【讨论】：

你能提供你的html吗？

刚刚添加，很抱歉没有从一开始就添加它

重新加载内容大约需要 9 分钟。将 90000 更改为 9000 用于测试目的

是的，但它会显示天气信息。天气信息不会那么快改变。我总是在测试时给它足够的时间来刷新。

【参考方案3】：

试试这个

window.top.location.reload();

【参考方案4】：

使用这个：

$('#forecast_embed',window.parent.document).attr('src',
             $('#forecast_embed',window.parent.document).attr('src'));

它必须解开你的问题。