IE9 surcharger window.close()

Version imprimable

25/07/2011, 12h27
Paul TOTH

IE9 surcharger window.close()
Bonjour,

Dans le cadre d'un développement j'ai migré des fenêtres popup classiques (window.open) vers des popups internes en IFRAME

pour simplifier les choses j'ai surchargé le code window.close() par ce code
Code:

1 2 3 4 if (window.frameElement) { window.close = function() { close_iframe_popup() } }
comme cela le code JS des anciennes popup fonctionne toujours en IFRAME

sauf que sous IE9 en DOCTYPE html4/loose, la fonction n'est plus surchargée, en mode debug je vois bien que window.close pointe toujours sur du code natif et l'appel à la fonction ne donne rien.

Quelqu'un aurait-il une astuce pour contourner cela sans changer le doctype ? un évènement, ou une syntaxe spécifique ?!

Merci
25/07/2011, 12h36
RomainVALERI

As-tu essayé d'associer ton gestionnaire autrement que par la méthode DOM-0 (element.on{type} = function() {//code}) ?

Je pense notamment à addEventListener/attachEvent.
25/07/2011, 14h46
Paul TOTH

Citation:

Envoyé par RomainVALERI

As-tu essayé d'associer ton gestionnaire autrement que par la méthode DOM-0 (element.on{type} = function() {//code}) ?

Je pense notamment à addEventListener/attachEvent.

oui, le problème est que window.close() dans une iframe ne déclenche rien :)
25/07/2011, 15h15
RomainVALERI

Ah ok, au temps pour moi, je comprends mieux. ^^

Du coup, par contre, quel est l'équivalent dans l'interface de ta nouvelle version (avec iframe) de la fermeture de popup ? il y a un bouton fermer dans l'iframe ? ou alors, si l'utilisateur n'est pas censé "fermer" la partie iframe, est-ce la fermeture de la page mère qui constitue l'événement probant ? si oui, il faut peut-être passer par onbeforeunload... à voir ^^
25/07/2011, 15h23
SpaceFrog

onbeforeunload ?

Citation:

Envoyé par RomainVALERI

Ah ok, au temps pour moi, je comprends mieux. ^^

Du coup, par contre, quel est l'équivalent dans l'interface de ta nouvelle version (avec iframe) de la fermeture de popup ? il y a un bouton fermer dans l'iframe ? ou alors, si l'utilisateur n'est pas censé "fermer" la partie iframe, est-ce la fermeture de la page mère qui constitue l'événement probant ? si oui, il faut peut-être passer par onbeforeunload... à voir ^^

alors initialement j'avais une popup ouverte par window.open(...) et en effet un bouton "Fermer" qui fait appelle window.close();

tout cela étant un framework maison, j'ai pu remplacer le window.open() par une fonction iframe_popup() qui ouvre l'URL dans une iframe qui gère un mode modale avec quelques DIV supplémentaires.

avec IE6..IE8, FF, Opera, Chrome, il m'a suffit de surcharger window.close() pour que le bouton Fermer (ou tout autre appel à la fonction window.close() dans un AJAX, ou que sais-je) fonctionne comme avant.

sous IE9, window.close() appelle le code natif et ne prend pas en compte mon code à moi :(

démonstration du problème :
Code:

1 2 3 4 5 6 7 8 9 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="fr"><html> <head> <title>IE9</title> <body> <iframe src="test.html"></iframe> </body> </html>
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="fr"> <head> <title>IE9</title> <script type="text/javascript"> window.close = function() { alert('pas de close'); } </script> </head> <body> <a href="javascript:window.close()">close</a> </body> </html>
Il suffit de supprimer le DOCTYPE du fichier principal pour que cela fonctionne...mais bonjour les dégâts sur le rendu HTML :D

Si tu veux déclencher des traitements à la fermeture, il me semble plus sain de passer par un gestionnaire lié à l'événement de fermeture plutot que de surcharger la méthode de fermeture elle-même, si je me fais bien comprendre ^^

Plus précisément, l'idée était d'essayer onbeforeunload :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="fr"> <head> <title>IE9</title> <script type="text/javascript"> window.onbeforeunload = function() { alert('juste avant la fermeture'); } </script> </head> <body> <a href="javascript:window.close()">close</a> </body> </html>
...ce qui ne modifie en rien ta façon de "fermer la fenêtre", et cela permet même (c'est habituellement la raison première de l'utilisation de cette technique, d'ailleurs) de gérer de la même manière les autres événements entrainant la fermeture (changement d'adresse dans la barre d'URL, clic sur l'icone "croix rouge" en haut à droite, fermeture du navigateur, etc.)

Par contre, si l'action est posée sur un bouton, et que l'événement de "fermeture" n'est plus souhaitable dans un contexte avec iframe, au bénéfice d'un traitement DOM sur la page mère qui vient "effacer" l'iframe, tu n'as bien sûr plus besoin de passer par la simulation d'une fermeture de popup...

Citation:
Envoyé par RomainVALERI
Si tu veux déclencher des traitements à la fermeture, il me semble plus sain de passer par un gestionnaire lié à l'événement de fermeture plutot que de surcharger la méthode de fermeture elle-même, si je me fais bien comprendre ^^

Plus précisément, l'idée était d'essayer onbeforeunload :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="fr"> <head> <title>IE9</title> <script type="text/javascript"> window.onbeforeunload = function() { alert('juste avant la fermeture'); } </script> </head> <body> <a href="javascript:window.close()">close</a> </body> </html>
...ce qui ne modifie en rien ta façon de "fermer la fenêtre", et cela permet même (c'est habituellement la raison première de l'utilisation de cette technique, d'ailleurs) de gérer de la même manière les autres événements entrainant la fermeture (changement d'adresse dans la barre d'URL, clic sur l'icone "croix rouge" en haut à droite, fermeture du navigateur, etc.)

Par contre, si l'action est posée sur un bouton, et que l'événement de "fermeture" n'est plus souhaitable dans un contexte avec iframe, au bénéfice d'un traitement DOM sur la page mère qui vient "effacer" l'iframe, tu n'as bien sûr plus besoin de passer par la simulation d'une fermeture de popup...
c'est tout le contraire :)

le bouton doit fermer l'IFRAME, mais une IFRAME ne se ferme pas avec window.close :)

mon exemple était trompeur, voici à quoi pourrait ressembler le code
Code:

1 2 3 4 5 6 7 8 <script type="text/javascript"> if (window.frameElement) { window.close = function() { window.frameElement.parentNode.removeChild(window.frameElement); } } </script>
la seule solution que je vois actuellement et de retrouver tous les window.close() partout dans le code et les remplacer par un close_popup() qui serait sous cette forme:
Code:

1 2 3 4 5 6 7 8 9 <script type="text/javascript"> function close_popup() { if (window.frameElement) window.frameElement.parentNode.removeChild(window.frameElement); else window.close(); } </script>
car le code HTML de la popup peut très bien être utilisé en dehors d'une iframe, la surcharge (conditionnée) de window.close() était la solution la plus immédiate et élégante...jusque IE9

Code:

1 2 3 4 5 6 7 <script type="text/javascript"> if (window.frameElement) { window.close = function() { window.frameElement.parentNode.removeChild(window.frameElement); } } </script>
Tu te compliques la vie pour rien comme ça et ça ne risque pas de fonctionner : frameElement référence l'objet window de ton iframe, qui n'a donc pas de parentNode.
Pourquoi ne pas passer tout simplement par la balise iframe ?
Code:

1 2 3 4 5 6 7 <script type="text/javascript"> if (document.getElementsByTagName('iframe').length) { window.close = function() { document.getElementsByTagName('iframe')[0].parentNode.removeChild(document.getElementsByTagName('iframe')[0]); } } </script>

Citation:
Envoyé par Bovino
Code:

1 2 3 4 5 6 7 <script type="text/javascript"> if (window.frameElement) { window.close = function() { window.frameElement.parentNode.removeChild(window.frameElement); } } </script>
Tu te compliques la vie pour rien comme ça et ça ne risque pas de fonctionner : frameElement référence l'objet window de ton iframe, qui n'a donc pas de parentNode.
Pourquoi ne pas passer tout simplement par la balise iframe ?
Code:

1 2 3 4 5 6 7 <script type="text/javascript"> if (document.getElementsByTagName('iframe').length) { window.close = function() { document.getElementsByTagName('iframe')[0].parentNode.removeChild(document.getElementsByTagName('iframe')[0]); } } </script>
merci pour ta contribution mais l'iframe a bel et bien un parent (frameElement c'est l'iframe pas l'objet window qui le contient), mon code fonctionne SAUF que sous IE9 on ne peut plus surcharger window.close()

26/07/2011, 18h41
Bovino
Ah oui tiens... au temps pour moi :oops:

Sinon, effectivement, pour surcharger window.close() avec IE9, il ne faut étonnamment pas passer par l'objet window mais par une fonction classique, peut-être parce que le prototype de cet objet n'est pas disponible...
Code:

1 2 3 function close(){ alert('toto'); }

Solution trouvé !

Arf, sans faire exprès j'ai trouvé la solution !

Code:

1
2
3
4
5
6
7
8
9
 
<script type="text/javascript">
if (window.frameElement) {
  window.close = function() { 
   window.frameElement.parentNode.removeChild(window.frameElement);
  }
  function close() { window.close() } // HACK !
}
</script>

c'est hallucinant, mais en définissant une fonction close() qui appelle window.close(), IE9 retrouve la surchage !

démonstration qui montre que c'est bien la surcharge qui est invoquée :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
 
<script type="text/javascript">
  window.close = function() { 
   alert('window.close()';
  }
  function close() { 
   alert('close()');
  }
}
</script>
<button onclick="window.close()">window.close()</button>
<button onclick="close()">close()</button>