Comment puis-je supprimer iframe en lui-même en utilisant javascript

Je sais qu'il y a plusieurs questions similaires, mais je dois recommencer la question avec le code ci-joint en raison de l'impossibilité de travailler. J'ai deux fichiers .xhtml dans le projet JSF. L'un est mainPage.xhtml dispose d'un bouton qui génère un code html dynamique pour créer un iframe (iFramePage.xhtml) et le montrer sur le navigateur;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets"> <h:head> <h:outputStylesheet library="css" name="style.css" /> <script type="text/javascript"> /** Create dynamic iframe HTML code for iFramePage.xhtml **/ function createIFrameHTML(){ document.getElementById("iFrameContainer").innerHTML = '<div id="iframe0"><iframe src="iFramePage.xhtml" width="450px" height="300px"></iframe></div>'; } /** Close iFrame **/ function removeElement() { /*Both lines work properly when I call inside this page, */ /*..however it does not work by calling from iFramePage.xhtml */ //document.getElementById("iFrameContainer").removeChild("iframe0"); $('iframe0').remove(); } </script> </h:head> <body> <f:view> <h:form id="mainForm"> <!-- Control Menu --> <div id="cntrMenu"> <h:commandButton id="cntrBtn1" onclick="createIFrameHTML();return false;"></h:commandButton> <h:commandButton id="cntrBtn2" onclick="removeElement();return false;"></h:commandButton> </div> <div id="iFrameContainer"> <!-- an iframe will be generated by createIFrameHTML() --> </div> </h:form> </f:view> </body> </html> 

L'autre page est iFramePage.xhtml qui possède un code html et javascript;

  • Tableau HTML avec en-tête fixe et pied de page et corps défilable sans largeur fixe
  • Définir la valeur d'un bouton en utilisant javascript
  • HTML 1ère option dans select n'est pas rendu sélectionné item sur la page Jquery mobile?
  • Le balisage Schema.org fonctionne si le balisage est construit de manière dynamique avec JavaScript?
  • Pourquoi `childNodes` renvoie un nombre plus grand que prévu?
  • Comment puis-je créer une liste déroulante modifiable en HTML / Javascript?
  •   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets"> <h:head> <h:outputScript name="......js" /> <h:outputStylesheet name="....css" /> <script> /** Close iFrame.**/ function closeSelf() { /* Two lines works properly, however third line does not work!*/ //window.top.location.href = "HIDDEN"; //parent.document.location.href = "HIDDEN"; parent.removeElement(); } </script> </h:head> <body> <input jsfc="h:commandButton" id="exitBtn" value="Kapat" onclick="closeSelf();" /> </body> </html> 

    Je peux générer l'iframe en cliquant sur le bouton "cntrBtn1" et en enlevant en cliquant sur "cntrBtn2" dans mainPage.xhtml. Cependant, je dois supprimer l'iframe à l'intérieur même (iFramePage.xhtml). Lorsque je clique sur "exitBtn" dans iFramePage.xhtml, l'iframe ne disparaît pas. Il n'y a rien à propos de cross-domain, car mainPage.xhtml et iFramePage.xhtml sont dans le même projet JSF, même dans le même répertoire. Je peux rediriger la page parent (regarde deux lignes dans closeSelf () dans iFramePage.xhtml), mais je ne peux pas supprimer l'iframe en utilisant l'élément parent, pourquoi! Aidez-moi, s'il vous plaît 🙂

  • Double colons dans la déclaration de fonction en Javascript?
  • Source postmessage IFrame
  • Déclenchez un bouton à partir d'un élément non-bouton
  • <Embed> ou <objet> marqueur gestionnaire d'erreur de lecture vidéo - JavaScript
  • Javascript-Définir l'image d'arrière-plan d'un DIV via un paramètre de fonction et de fonction
  • Obtenir un tableau d'octets via le type d'entrée = fichier
  • One Solution collect form web for “Comment puis-je supprimer iframe en lui-même en utilisant javascript”

    Communiquez entre le parent et l'iframe en utilisant window.postMessage .

    Remplacez la fonction closeSelf () dans la page iframe par la suivante:

     function closeSelf() { parent.window.postMessage("removetheiframe", "*"); } 

    Et sur la page parent, ajoutez le code suivant pour écouter lorsque l' iframe envoie un message:

     function receiveMessage(event){ if (event.data=="removetheiframe"){ var element = document.getElementById('iframe-element'); element.parentNode.removeChild(element); } } window.addEventListener("message", receiveMessage, false); 

    Vous pouvez également vérifier l'origine de PostMessage par event.origin pour vous assurer que le bon iframe a demandé de supprimer l' iframe .

    JavaScript rend le site Web intelligent, beauté et facile à utiliser.