Rechargez un IFRAME sans ajouter à l'historique

Je change un src d'IFRAME pour le recharger, il fonctionne bien et déclenche l'événement onload lorsqu'il charge son HTML.

Mais il ajoute une entrée à l'histoire, que je ne veux pas. Existe-t-il un moyen de recharger un IFRAME et n'affecte pas l'histoire?

Vous pouvez utiliser javascript location.replace :

 window.location.replace('...html'); 

Remplacez le document actuel par celui de l'URL fournie. La différence par rapport à la méthode assign () est qu'après l'utilisation de replace (), la page actuelle ne sera pas enregistrée dans l'historique des sessions, ce qui signifie que l'utilisateur ne pourra pas utiliser le bouton Précédent pour naviguer vers lui.

L'utilisation de replace () n'est qu'une option avec vos propres iframes de domaine. Il ne fonctionne pas sur des sites distants (p. Ex.: Un bouton Twitter) et nécessite des connaissances spécifiques au navigateur pour accéder de manière fiable à la fenêtre enfant.

Au lieu de cela, supprimez simplement l'élément iframe et construisez un nouveau dans le même endroit. Les éléments de l'historique ne sont créés que lorsque vous modifiez l'attribut src après qu'il se trouve dans le DOM, assurez-vous de le définir avant l'ajout.

Edit: JDandChips mentionne à juste titre que vous pouvez supprimer de DOM, modifiez et ajoutez de nouveau. La construction de frais n'est pas nécessaire.

Comme Greg l'a dit plus haut, la fonction .replace () est la façon de procéder. Je ne peux pas trouver comment répondre à sa réponse *, mais l'astuce consiste à faire référence à la propriété iFrames contentWindow.

 var ifr = document.getElementById("iframeId"); ifr.contentWindow.location.replace("newLocation.html"); 

* J'ai appris que j'ai besoin de plus de réputation pour commenter une réponse.

Une autre méthode pour recréer l'iframe serait de supprimer l'iframe du DOM, de modifier le src, puis de l'ajouter.

À bien des égards, cela ressemble à la suggestion de replace() , mais j'ai eu des problèmes lorsque j'ai essayé cette approche avec History.js et gérer les états manuellement.

 var container = iframe.parent(); iframe.remove(); iframe.attr('src', 'about:blank'); container.append(iframe); 

Essayez d'utiliser cette fonction pour remplacer l'ancien iframe par un nouvel iframe copié de l'ancien.

 function setIFrameSrc(idFrame, url) { var originalFrame = document.getElementById(idFrame); var newFrame = document.createElement("iframe"); newFrame.id = originalFrame.getAttribute("id"); newFrame.width = originalFrame.getAttribute("width"); newFrame.height = originalFrame.getAttribute("height"); newFrame.src = url; var parent = originalFrame.parentNode; parent.replaceChild(newFrame, originalFrame); } 

Utilisez-le comme ceci:

 setIFrameSrc("idframe", "test.html"); 

De cette façon, ne sera pas ajouté l'URL de l'iframe à l'historique du navigateur.

Une solution consiste à utiliser la balise d' object plutôt que la balise iframe .

Remplacer ceci:

 <iframe src="http://yourpage"/> 

Par ça:

 <object type="text/html" data="http://yourpage"/> 

Vous permettra de mettre à jour l'attribut des data sans affecter l'historique. Ceci est utile si vous utilisez un cadre déclaratif tel que React.js où vous ne devez pas faire de commande impérative pour mettre à jour le DOM.

Plus de détails sur les différences entre iframe et object : Utilisation de Iframe ou Object tag pour intégrer des pages Web dans un autre

La solution de chargement la plus simple et la plus rapide
Utilisez window.location.replace pour ne pas mettre à jour l'historique lors du chargement de la page ou du cadre.

Pour les liens, cela ressemble à ceci:

 <a href="#" onclick="YourTarget.location.replace ('http://www.YourPage.com');"> The targeted Link</a> 

ou

 <a href="javascript:YourTarget.location.replace ('http://www.YourPage.com');"> The targeted Link</a> 

Mais si vous voulez qu'il ne fonctionne pas à partir du lien, mais que vous agissez automatiquement lors du chargement du cadre puis de l'iframe, vous devriez le mettre dans la section du corps du fichier iframe:

 onload="window.location.replace ('http://www.YourPage.com');" 

Si, pour une raison ou une autre, la charge ne se charge pas dans l'iframe, placez votre nom de cadre cible au lieu de la fenêtre dans la syntaxe comme ceci:

 onload="YourTarget.location.replace ('http://www.YourPage.com');" 

REMARQUE: pour ce script, onmouseover , onmouseover , onmouseout , onload et href="javascript:" fonctionneront.

Utilisez la méthode de replace pour contourner l'ajout de l'URL de l'iframe à l'historique:

HTML:

 <iframe id="myIframe" width="100%" height="400" src="#"></iframe> 

JavaScript:

 var ifr = document.getElementById('mIframe') if (ifr) { ifr.contentWindow.location.replace('http://www.blabla.com') }