blocks|key|1358800|text|var+iframe+=+document.getElementById('youriframe');
iframe.src+=+iframe.src;|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1358801|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>var iframe = document.getElementById('youriframe');
iframe.src = iframe.src;
</code></pre>

blocks|key|1143742|text|这应该会有帮助：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1143743|document.getElementById('FrameID').contentWindow.location.reload(true);|code-block|syntax|javascript|1143744|编辑:根据@Joro的评论修改对象名称。|1143745|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

This should help:

<pre><code>document.getElementById('FrameID').contentWindow.location.reload(true);
</code></pre>

EDIT: Fixed the object name as per @Joro's comment.

blocks|key|1358946|text|如果iframe是从同一个域加载的，您可以这样做，这会更有意义一些：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1358947|iframe.contentWindow.location.reload();|code-block|syntax|javascript|1358948|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

provided the iframe is loaded from the same domain, you can do this, which makes a little more sense:

<pre><code>iframe.contentWindow.location.reload();
</code></pre>

blocks|key|1143973|text|适用于IE、Mozzila、Chrome|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1143974|document.getElementById('YOUR+IFRAME').contentDocument.location.reload(true);|code-block|syntax|javascript|1143975|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

Works for IE, Mozzila, Chrome

<pre><code>document.getElementById('YOUR IFRAME').contentDocument.location.reload(true);
</code></pre>

blocks|key|1359185|text|您可以使用这个简单的方法|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1359186|function+reloadFrame(iFrame)+{

++++iFrame.parentNode.replaceChild(iFrame.cloneNode(),+iFrame);

}|code-block|syntax|javascript|1359187|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

You can use this simple method

<pre><code>function reloadFrame(iFrame) {

 iFrame.parentNode.replaceChild(iFrame.cloneNode(), iFrame);

}
</code></pre>

blocks|key|1143763|text|这是从here得到的|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1143764|var+f+=+document.getElementById('iframe1');
f.src+=+f.src;|code-block|syntax|javascript|1143765|entityMap|0|LINK|mutability|MUTABLE|url|http://bytes.com/topic/javascript/answers/468654-refresh-iframe^0|3|4|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@$A|R|B|S|1|T]]|C|$]]|$1|D|3|E|5|F|7|U|8|@]|9|@]|C|$G|H]]|$1|I|3|-4|5|6|7|V|8|@]|9|@]|C|$]]]|J|$K|$5|L|M|N|C|$O|P]]]]

Got this from <a href="http://bytes.com/topic/javascript/answers/468654-refresh-iframe" rel="nofollow noreferrer">here</a>

<pre><code>var f = document.getElementById('iframe1');
f.src = f.src;
</code></pre>

blocks|key|1359215|text|直接重置src属性：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1359216|iframe.src+=+iframe.src;|code-block|syntax|javascript|1359217|使用缓存中断的时间戳重置src：|1359218|iframe.src+=++iframe.src.split("?")[0]+%2B+"?_="+%2B+new+Date().getTime();|1359219|无法清除src+when+query+strings选项(数据URI)：|1359220|var+wasSrc+=+iframe.src

iframe.onload+=+function()+{
++++iframe.onload+=+undefined;
++++iframe.src+=+wasSrc;
}|1359221|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|S|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|U|8|@]|9|@]|A|$]]|$1|M|3|N|5|D|7|V|8|@]|9|@]|A|$E|F]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

Resetting the src attribute directly:

<pre><code>iframe.src = iframe.src;
</code></pre>

Resetting the src with a time stamp for cache busting:

<pre><code>iframe.src = iframe.src.split("?")[0] + "?_=" + new Date().getTime();
</code></pre>

Clearing the src when query strings option is not possible (Data URI):

<pre><code>var wasSrc = iframe.src

iframe.onload = function() {
 iframe.onload = undefined;
 iframe.src = wasSrc;
}
</code></pre>

blocks|key|1144245|text|2017年：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1144246|如果它在同一个域中，只需：|1144247|iframe.contentWindow.location.reload();|code-block|syntax|javascript|1144248|都会起作用的。|1144249|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|N|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|O|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|P|8|@]|9|@]|A|$]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

2017:

If it in on same domain just :

<pre><code>iframe.contentWindow.location.reload();
</code></pre>

will work.

blocks|key|1359436|text|如果您使用散列路径(如mywebsite.com/#/my/url)，它可能不会在切换散列时刷新帧：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1359437|<script>
++++window.onhashchange+=+function+()+{
++++++++window.setTimeout(function+()+{
++++++++++++let+frame+=+document.getElementById('myFrame');
++++++++++++if+(frame+!==+null)+{frame.replaceWith(frame);}
++++++++},+1000);
++++}
</script>|code-block|syntax|javascript|1359438|不幸的是，如果不使用超时，JS可能会在页面加载完内容之前尝试替换框架(从而加载旧内容)。我还不确定解决方法。|1359439|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

If you use hash paths (like mywebsite.com/#/my/url) which might not refresh frames on switching hash:

<pre><code>&lt;script&gt;
 window.onhashchange = function () {
 window.setTimeout(function () {
 let frame = document.getElementById('myFrame');
 if (frame !== null) {frame.replaceWith(frame);}
 }, 1000);
 }
&lt;/script&gt;
</code></pre>

Unfortunately, if you don't use the timeout JS may try to replace the frame before the page has finished loading the content (thus loading the old content). I'm not sure of the workaround yet.

blocks|key|1143837|text|下面是HTML代码片段：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1143838|<td><iframe+name="idFrame"+id="idFrame"+src="chat.txt"+width="468"+height="300"></iframe></td>|code-block|syntax|javascript|1143839|和我的Javascript代码：|1143840|window.onload+=+function(){
setInterval(function(){
++++parent.frames['idFrame'].location.href+=+"chat.txt";
},1000);}|1143841|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

Here is the HTML snippet:

<pre><code>&lt;td&gt;&lt;iframe name="idFrame" id="idFrame" src="chat.txt" width="468" height="300"&gt;&lt;/iframe&gt;&lt;/td&gt;
</code></pre>

And my Javascript code:

<pre><code>window.onload = function(){
setInterval(function(){
 parent.frames['idFrame'].location.href = "chat.txt";
},1000);}
</code></pre>

blocks|key|1143941|text|如果页面中有多个iFrames，那么这个脚本可能会很有用。我断言在iFrame源代码中有一个可以用来查找特定iFrame的特定值。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1143942|var+iframes+=+document.getElementsByTagName('iframe');
var+yourIframe+=+null
for(var+i=0;+i+<+iframes.length+;i%2B%2B){
++++var+source+=++iframes[i].attributes.src.nodeValue;
++++if(source.indexOf('/yourSorce')+>+-1){
++++++++yourIframe+=+iframes[i];
++++}+++
}
var+iSource+=+yourIframe.attributes.src.nodeValue;
yourIframe.src+=+iSource;|code-block|syntax|javascript|1143943|将"/yourSource“替换为所需的值。|1143944|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

If you have Multiple iFrames inside the page, then this script might be useful. I am asuming there is a specific value in the iFrame source which can be used to find the specific iFrame.

<pre><code>var iframes = document.getElementsByTagName('iframe');
var yourIframe = null
for(var i=0; i &lt; iframes.length ;i++){
 var source = iframes[i].attributes.src.nodeValue;
 if(source.indexOf('/yourSorce') &gt; -1){
 yourIframe = iframes[i];
 } 
}
var iSource = yourIframe.attributes.src.nodeValue;
yourIframe.src = iSource;
</code></pre>

Replace "/yourSource" with value you need.

blocks|key|1359165|text|如果你的iframe的URL没有改变，你可以重新创建它。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1359166|如果您的iframe不是来自同一来源(协议方案、主机名和端口)，您将无法知道iframe中的当前URL，因此您需要在iframe文档中使用一个脚本来与其父窗口(页面窗口)交换消息。|1359167|在iframe文档中：|1359168|window.addEventListener('change',+function(e)+{
++if+(e.data+===+'Please+reload+yourself')+{
++++var+skipCache+=+true;+//+true+===+Shift%2BF5
++++window.location.reload(skipCache);
++}
}|code-block|syntax|javascript|1359169|在您的页面中：|1359170|var+iframe+=+document.getElementById('my-iframe');
var+targetOrigin+=+iframe.src;+//+Use+'*'+if+you+don't+care
iframe.postMessage('Please+reload+yourself',+targetOrigin);|1359171|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|S|8|@]|9|@]|A|$]]|$1|F|3|G|5|H|7|T|8|@]|9|@]|A|$I|J]]|$1|K|3|L|5|6|7|U|8|@]|9|@]|A|$]]|$1|M|3|N|5|H|7|V|8|@]|9|@]|A|$I|J]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

If your iframe's URL does not change, you can just recreate it.

If your iframe is not from the same origin (protocol scheme, hostname and port), you will not be able to know the current URL in the iframe, so you will need a script in the iframe document to exchange messages with its parent window (the page's window).

In the iframe document:

<pre><code>window.addEventListener('change', function(e) {
 if (e.data === 'Please reload yourself') {
 var skipCache = true; // true === Shift+F5
 window.location.reload(skipCache);
 }
}
</code></pre>

In your page:

<pre><code>var iframe = document.getElementById('my-iframe');
var targetOrigin = iframe.src; // Use '*' if you don't care
iframe.postMessage('Please reload yourself', targetOrigin);
</code></pre>

blocks|key|1143979|text|您可以使用以下命令：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1143980|Js：|1143981|function+refreshFrame(){
++++$('#myFrame').attr('src',+"http://blablab.com?v=");
}|code-block|syntax|javascript|1143982|Html：|1143983|`<iframe+id="myFrame"+src=""></iframe>`|1143984|JS小提琴：https://jsfiddle.net/wpb20vzx/|offset|length|1143985|entityMap|0|LINK|mutability|MUTABLE|url|https://jsfiddle.net/wpb20vzx/^0|0|0|0|0|0|6|U|0|0^^$0|@$1|2|3|4|5|6|7|Y|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|Z|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|10|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|11|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|12|8|@]|9|@]|A|$G|H]]|$1|M|3|N|5|6|7|13|8|@]|9|@$O|14|P|15|1|16]]|A|$]]|$1|Q|3|-4|5|6|7|17|8|@]|9|@]|A|$]]]|R|$S|$5|T|U|V|A|$W|X]]]]

You can use this:

Js:

<pre><code>function refreshFrame(){
 $('#myFrame').attr('src', "http://blablab.com?v=");
}
</code></pre>

Html:

<pre><code>`&lt;iframe id="myFrame" src=""&gt;&lt;/iframe&gt;`
</code></pre>

JS Fiddle : <a href="https://jsfiddle.net/wpb20vzx/" rel="nofollow">https://jsfiddle.net/wpb20vzx/</a>

I have a webpage with an IFrame and a Button, once the button is pressed I need the IFrame to be refreshed. Is this possible, if so how? I searched and could not find any answers.

How to refresh an IFrame using Javascript?

我有一个带有IFrame和按钮的网页，一旦按钮被按下，我需要刷新IFrame。这是可能的吗，如果是的话，是如何实现的呢？我找了一下，没有找到任何答案。

问如何使用Javascript刷新IFrame？
EN

回答 13

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用Javascript刷新IFrame？EN

回答 13

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用Javascript刷新IFrame？
EN