2009-08-20 5 views
27

Y at-il une manière de décharger une page qui a été chargée dans un iframe? Je ne veux pas remplacer iframe src par une page blanche si possible. Je cherche fondamentalement quelque chose qui fera quelque chose comme ceci $('#frameID').attr("src",""); excepté que le code ne semble pas effacer la page précédemment chargée.Déchargement/suppression de contenu d'un iFrame

Y a-t-il une fonction "unload" que je peux appeler qui réinitialisera l'iframe pour qu'il ne contienne aucun contenu chargé à l'intérieur?

+4

vous pouvez simplement supprimer et créer un nouveau iframe. –

+5

'$ (" # frameID "). Attr (" src "," ")' fonctionne très bien pour moi sur Firefox 11. Si vous voulez vraiment un iframe vierge, vous pouvez également essayer de régler le 'src' à' about: blank' au lieu d'une chaîne vide. –

+0

@IlmariKaronen 'about: blank' fonctionne à merveille !!! – TheVillageIdiot

Répondre

24

Les autres solutions utilisent innerHTML, ce qui ne fonctionne pas toujours en XHTML. Ils ne suppriment également que document.body (tout ce qui figure dans le <head> est toujours présent). Voici une solution qui utilise les DOM:

var frame = document.getElementById("myFrame"), 
frameDoc = frame.contentDocument || frame.contentWindow.document; 
frameDoc.removeChild(frameDoc.documentElement); 

Cette solution utilise innerHTML:

var frame = document.getElementById("myFrame"), 
frameDoc = frame.contentDocument || frame.contentWindow.document; 
frameDoc.documentElement.innerHTML = ""; 
+1

merci j'ai fini par utiliser cette – Dan

+1

Bonne Solution, vraiment appréciée !! –

+2

Comme [AJ Ostergaard] (http://stackoverflow.com/users/63306/aj-ostergaard) l'a souligné dans une [edit suggestion] (http://stackoverflow.com/suggested-edits/227353), cela ne peut être que fonctionne si l'iframe est sur le même domaine que la page principale. J'ai rejeté l'édition pour être égaré, mais son point est toujours correct et mérite d'être mentionné. –

4

$ ('# frameID'). ContentWindow.document.body.innerHTML = '';

Comme avec tout iframe, cela ne fonctionne que si vous êtes sur le même domaine.

+1

pouvez-vous faire '.contentWindow'? – geowa4

1

Tout d'abord, obtenir le document du cadre:

var frame = $('#frameId').get(0); 
var frameDoc = frame.contentDocument || frame.contentWindow.document; 

Puis, vide il:

frameDoc.getElementsByTagName('body')[0].innerHTML = ""; 

Je pense que cela devrait fonctionner aussi:

$('body', frameDoc).html(""); 

Maintenant, vous pourriez vouloir faire quelque chose avec des scripts qui pourraient être chargés dans la tête, mais cela devrait vous aider à démarrer.

2
$("#frameId").contents().find("div#SomeDIVinsideFrame").remove(); // removes some div content inside iframe 

$("#FrameId").remove(); // removes frame 

avait même problème pour montrer nouvelles iframe sur http://www.livepage.info

1

Vous pouvez déclencher événement Unload que iframe comme

$('body').trigger('unload'); 

puis supprimez l'iframe de la fenêtre parente et rechargez une nouvelle iframe avec un nouveau src lorsque cela est nécessaire.

$('#iframe_wrapper').html(''); 
$('#iframe_wrapper').html('<iframe src="...">'); 
0
function getContentFromIframe(iFrameName) 
{ 

var myIFrame = document.getElementById(iFrameName); 
var content = myIFrame.contentWindow.document.body.innerHTML; 

//Do whatever you need with the content  

} 

il va certainement travailler !!!!!!!!!!!!!!!!

7

Essayez ceci,

$("iframe").contents().find("body").html(''); 

Il efface uniquement innerHTML de votre étiquette à l'intérieur et pas vraiment décharger votre iframe afin que vous puissiez réutiliser votre iframe sans recharger et son fonctionnement dans tous les navigateurs et assez simple !!

+3

Mais cela ne fonctionne que si l'iframe est chargé à partir du même domaine, non? – Robert

+0

oui, vous ne pouvez pas travailler avec un domaine différent !!! –

2

Supprimer et recréer l'iframe est la solution la plus intelligente ici (sans vouloir offenser les autres réponses).

En supprimant seulement le innerHTML de l'iframe vous ne vident pas les variables stockées, les eventListeners liées etc.

Soyez prudent avec cela, il pourrait causer beaucoup de problèmes (comme les fuites de mémoire, plusieurs déclencheurs de le même événement etc.).

0

Cela a fonctionné pour moi, tout a effacé dans le tag iframe; corps, tête, html et tout:

$("iframe").contents().empty(); 
4

Si vous générer dynamiquement le contenu de votre iframe, tous les scripts/variables chargée fuira d'une écriture à l'autre. Ainsi, la solution fournie par @Eli d'effacement de l'élément dom ne fonctionnera pas.

En bref:

Pour nettoyer, envelopper votre iframe dans un élément div et remplacer son contenu dom.

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>JS Bin</title> 
</head> 
<body> 
    <div id="wrapper"> 
    <iframe id="test"></iframe> 
    </div> 
</body> 
</html> 

Pour nettoyer:

var wrapper = document.getElementById('wrapper'); 
wrapper.innerHTML= "<iframe id='test'></iframe>"; 

détails: Demo de fuite script

Exemple de fuite de script entre deux iframe écritures (testé avec Chrome):

var iframe = document.getElementById('test'); 

// define variable 'a' 
var content = "<html><body><script>var a=555;</script></body></html>"; 

iframe.contentWindow.document.open(); 
iframe.contentWindow.document.write(content); 
iframe.contentWindow.document.close(); 

// uncomment this to clean the iframe 
//document.getElementById('wrapper').innerHTML= "<iframe id='test'></iframe>"; 

// write 'a' if defined 
var content2 = "<html><body><div id='content'></div><script>document.getElementById('content').innerHTML=typeof a === 'undefined' ? 'undefined' : a;</script></body></html>"; 

var iframe2 = document.getElementById('test'); 
iframe2.contentWindow.document.open(); 
iframe2.contentWindow.document.write(content2); 
iframe2.contentWindow.document.close(); 

Si vous exécutez ce code, vous verrez la sortie du deuxième iframe est 555 bien qu'il ait été défini dans le premier iframe.

Si vous décommentez la partie centrale, cela fonctionnera comme prévu.

question connexe: Avoiding memory leaks loading content into an iframe

1
var frame = document.getElementById("myframe"); 
frame.src = "about:blank"; 

Cela a fonctionné de moi et les fuites de mémoire empêché aussi. Dans mon cas, j'ai dû détruire le parent aussi. Dans ce cas, vous devez détruire le parent avec un certain délai pour éviter les fuites de mémoire

+0

Par "parent", voulez-vous dire la page parente, ou l'élément parent dans le DOM qui contenait la balise IFRAME? – donohoe

+0

L'élément parent qui contient l'iframe – Antonis

Questions connexes