How to update IFrame using Javascript?

Question

I have a webpage with an IFrame and Button as soon as the button is clicked. I need the IFrame to be updated. Is this possible, if so, how? I searched and could not find the answers.

Answer 1

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

Answer 2

This should help:

 document.getElementById('FrameID').contentWindow.location.reload(true); 

EDIT: Fixed object name according to @Joro comment.

Answer 3

if the iframe is loaded from the same domain, you can do this, which makes sense:

iframe.contentWindow.location.reload();

Answer 4

Works for IE, Mozzila, Chrome

 document.getElementById('YOUR IFRAME').contentDocument.location.reload(true); 

Answer 5

Get it from here.

 var f = document.getElementById('iframe1'); f.src = f.src; 

Answer 6

Here is the HTML snippet:

 <td><iframe name="idFrame" id="idFrame" src="chat.txt" width="468" height="300"></iframe></td> 

And my Javascript code:

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

Answer 7

You can use this simple method.

 function reloadFrame(iFrame) { iFrame.parentNode.replaceChild(iFrame.cloneNode(), iFrame); } 

Answer 8

If there are several iFrames on the page, then this script may be useful. I assume that there is a specific value in the iFrame source that can be used to search for a specific iFrame.

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

Replace "/ yourSource" with the desired value.

Answer 9

If your iframe url doesn't change, you can simply restore it.

If your iframe does not have the same origin (protocol scheme, host name and port), you will not be able to find out the current URL in the iframe, so you will need a script in the iframe document to exchange messages with its parent window (page window).

In an iframe document:

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

On your page:

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

Answer 10

Resetting the src attribute directly:

 iframe.src = iframe.src; 

Reset src with timestamp for cache splitting:

 iframe.src = iframe.src.split("?")[0] + "?_=" + new Date().getTime(); 

Removing the src parameter when the query string is unavailable (data URI):

 var wasSrc = iframe.src iframe.onload = function() { iframe.onload = undefined; iframe.src = wasSrc; } 

Answer 11

2017

If it is in one domain simply:

 iframe.contentWindow.location.reload(); 

will work.

Answer 12

You can use this:

Js:

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

Html:

 `<iframe id="myFrame" src=""></iframe>` 

JS Fiddle: https://jsfiddle.net/wpb20vzx/