IE9 surcharger window.close() [Résolu]

Paul TOTH · 25/07/2011, 12h27

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

RomainVALERI · 25/07/2011, 12h36

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.

Paul TOTH · 25/07/2011, 14h46

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

RomainVALERI · 25/07/2011, 15h15

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 ^^

SpaceFrog · 25/07/2011, 15h23

onbeforeunload ?

Paul TOTH · 25/07/2011, 19h15

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 html :

Sélectionner tout - Visualiser dans une fenêtre à part

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 html :

Sélectionner tout - Visualiser dans une fenêtre à part

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

RomainVALERI · 25/07/2011, 20h37

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 html :

Sélectionner tout - Visualiser dans une fenêtre à part

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...

Paul TOTH · 26/07/2011, 07h35

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 html :

Sélectionner tout - Visualiser dans une fenêtre à part

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 html :

Sélectionner tout - Visualiser dans une fenêtre à part

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 html :

Sélectionner tout - Visualiser dans une fenêtre à part

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

Bovino · 26/07/2011, 08h15

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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>

Paul TOTH · 26/07/2011, 08h42

Citation:

Envoyé par Bovino

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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()

Bovino · 26/07/2011, 18h41

Ah oui tiens... au temps pour moi

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

Paul TOTH · 27/07/2011, 11h37

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

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

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 html :

Sélectionner tout - Visualiser dans une fenêtre à part

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>

25/07/2011, 12h36	#2
RomainVALERI Expert Confirmé Sénior Romain VALERI POOête Inscription : avril 2008 Messages : 2 572 Détails du profil Informations personnelles : Nom : Romain VALERI Âge : 35 Localisation : France, Meurthe et Moselle (Lorraine) Informations professionnelles : Activité : POOête Informations forums : Inscription : avril 2008 Messages : 2 572 Points : 4 074 Points : 4 074	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. __________________ ...pour les linguistes et les curieux >>> générateur de phrases aléatoires __________________
	00

25/07/2011, 15h15	#4
RomainVALERI Expert Confirmé Sénior Romain VALERI POOête Inscription : avril 2008 Messages : 2 572 Détails du profil Informations personnelles : Nom : Romain VALERI Âge : 35 Localisation : France, Meurthe et Moselle (Lorraine) Informations professionnelles : Activité : POOête Informations forums : Inscription : avril 2008 Messages : 2 572 Points : 4 074 Points : 4 074	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 ^^ __________________ ...pour les linguistes et les curieux >>> générateur de phrases aléatoires __________________
	00

25/07/2011, 15h23	#5
SpaceFrog Rédacteur/Modérateur Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Inscription : mars 2002 Messages : 30 029 Détails du profil Informations personnelles : Sexe : Localisation : Royaume-Uni Informations professionnelles : Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Secteur : Industrie Informations forums : Inscription : mars 2002 Messages : 30 029 Points : 45 128 Points : 45 128	onbeforeunload ? __________________ Ma page Developpez Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts) Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir... Votre post est résolu ? Alors n'oubliez pas le Tag réalisations :www.planet-languages.com\|www.saftair.com\| www.ouestisol.fr \| www.sebemex.fr \| www.extramiante.fr \| www.sistac-alizay.fr \| www.acoustishop.fr \| www.litt.fr \| www.ouestventil.fr
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email