Comment actualiser un IFrame en utilisant Javascript?

J'ai une page Web avec un IFrame et un Button, une fois que le bouton est enfoncé, j'ai besoin que l'IFrame soit actualisé. Est-ce possible, si oui, comment? J'ai cherché et je n'ai trouvé aucune réponse.

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

Cela devrait aider:

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

EDIT: Correction du nom de l'objet selon le commentaire de @ Joro.

à condition que l'iframe soit chargé à partir du même domaine, vous pouvez le faire, ce qui est un peu plus logique:

iframe.contentWindow.location.reload();

Fonctionne pour IE, Mozzila, Chrome

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

Vous pouvez utiliser cette méthode simple

function reloadFrame(iFrame) {

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

}

J'ai ça d' ici

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

2017:

S'il se trouve sur le même domaine:

iframe.contentWindow.location.reload();

marchera.

Voici l'extrait de code HTML:

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

Et mon code Javascript:

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

Réinitialisation directe de l'attribut src:

iframe.src = iframe.src;

Réinitialiser le src avec un horodatage pour le contournement du cache:

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

Effacer le src lorsque l'option de chaînes de requête n'est pas possible (URI de données):

var wasSrc = iframe.src

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

Si vous utilisez des chemins de hachage (comme mywebsite.com/#/my/url) qui risquent de ne pas actualiser les cadres lors du changement de hachage:

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

Malheureusement, si vous n'utilisez pas le délai d'expiration, JS peut essayer de remplacer le cadre avant que la page n'ait fini de charger le contenu (chargeant ainsi l'ancien contenu). Je ne suis pas encore sûr de la solution de contournement.

Si vous avez plusieurs iFrames dans la page, ce script peut être utile. Je suppose qu'il y a une valeur spécifique dans la source iFrame qui peut être utilisée pour trouver l'iFrame spécifique.

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;

Remplacez "/ yourSource" par la valeur dont vous avez besoin.

Si l'URL de votre iframe ne change pas, vous pouvez simplement la recréer.

Si votre iframe n'est pas de la même origine (schéma de protocole, nom d'hôte et port), vous ne pourrez pas connaître l'URL actuelle dans l'iframe, vous aurez donc besoin d'un script dans le document iframe pour échanger des messages avec sa fenêtre parent ( la fenêtre de la page).

Dans le document iframe:

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

Dans votre page:

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

Vous pouvez utiliser ceci:

Js:

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

Html:

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

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