Ouvrir la fenêtre contextuelle et actualiser la page parente à la fermeture de la fenêtre contextuelle

94

J'ai ouvert une fenêtre contextuelle par window.open en JavaScript, je souhaite actualiser la page parent lorsque je ferme cette fenêtre contextuelle. (Événement onclose?) Comment puis-je faire cela?

window.open("foo.html","windowName", "width=200,height=200,scrollbars=no");
javascript html javascript-events ArMaN
la source
1
Veuillez vérifier ceci: stackoverflow.com/questions/18321323/… pourrait aider quelqu'un
NoNaMe

Réponses:

231

Vous pouvez accéder à la fenêtre parente en utilisant ' window.opener ', donc, écrivez quelque chose comme ce qui suit dans la fenêtre enfant:

<script>
    window.onunload = refreshParent;
    function refreshParent() {
        window.opener.location.reload();
    }
</script>
Morrison Cole
la source
Je ne connaissais pas window.opener, merci! Je mets toujours la fenêtre de l'appelant dans une variable dans le contentWindow de l'enfant. : - /
kay - SE is evil
3
Si vous ne contrôlez pas JavaScript sur la page enfant (par exemple, flux OAuth), vous devrez vérifier en popupWindow.closedutilisant setIntervalcomme dans la solution de @ Zuul.
jchook
34

La fenêtre contextuelle ne contient aucun événement de fermeture que vous pouvez écouter.

D'autre part, il existe une propriété fermée qui est définie sur true lorsque la fenêtre se ferme.

Vous pouvez définir une minuterie pour vérifier cette propriété fermée et le faire comme ceci:

var win = window.open('foo.html', 'windowName',"width=200,height=200,scrollbars=no");   
var timer = setInterval(function() {   
    if(win.closed) {  
        clearInterval(timer);  
        alert('closed');  
    }  
}, 1000);

Voir cet exemple de travail Fiddle !

Zuul
la source
1
je ne veux pas utiliser de minuterie! une autre idée?
ArMaN
1
Un peu hackish, mais je pense que l'utilisation d'une minuterie fonctionnera le mieux sur tous les navigateurs.
kay - SE is evil
C'est également la meilleure solution si la fenêtre contextuelle comporte plusieurs pages avant de se fermer, car l'événement onunload est déclenché uniquement après que l'utilisateur quitte la première page.
AntonChanning
14

sur votre page enfant, mettez-les:

<script type="text/javascript">
    function refreshAndClose() {
        window.opener.location.reload(true);
        window.close();
    }
</script>

et

<body onbeforeunload="refreshAndClose();">

mais comme une bonne conception d'interface utilisateur, vous devriez utiliser un Close buttoncar il est plus convivial. voir le code ci-dessous.

<script type="text/javascript">
    $(document).ready(function () {
        $('#btn').click(function () {
            window.opener.location.reload(true);
            window.close();
        });
    });
</script>

<input type='button' id='btn' value='Close' />
Ray Cheng
la source
lorsque la fenêtre contextuelle est fermée, pas lorsque l'utilisateur clique sur un bouton pour actualiser la page et fermer la fenêtre contextuelle
gengkev
@gengkev, je savais qu'OP voulait attacher l'événement à la fermeture de la fenêtre, mais je pense que l'utilisation d'un bouton est une meilleure conception de l'interface utilisateur. cependant, j'ai inclus le code pour les deux. s'il vous plaît donnez votre avis.
Ray Cheng
J'ai utilisé <body onbeforeunload = "refreshAndClose ();"> <script type = "text / javascript"> function refreshAndClose () {window.opener.location.reload (true); } self.close (); </script>
steve0nz
3

J'utilise ceci: 

<script language='javascript'>
var t;
function doLoad() {
t = setTimeout("window.close()",1000);
}

</script>
<script type="text/javascript">
function refreshAndClose() {
    window.opener.location.reload(true);
    window.close();
}
</script>
<body onbeforeunload="refreshAndClose();" onLoad='doLoad()''>

lorsque la fenêtre se ferme, elle actualise la fenêtre parente.

Patrick Kershner
la source
2

window.open renverra une référence à la fenêtre nouvellement créée, à condition que l'URL ouverte soit conforme à la politique de même origine .

Cela devrait fonctionner:

function windowClose() {
    window.location.reload();
}

var foo = window.open("foo.html","windowName", "width=200,height=200,scrollbars=no");
foo.onbeforeunload= windowClose;​
Cranz
la source
Ne fonctionnera pas si l'utilisateur peut suivre les liens dans la fenêtre ouverte. Et je suis tout à fait sûr qu'un événement de déchargement est lancé avant le premier chargement de l'URL cible, car vous laissez implicitement about: blank. (+1 pour mentionner SOP)
kay - SE is evil
2

Dans mon cas, j'ai ouvert une fenêtre contextuelle en cliquant sur le bouton de lien dans la page parent. Pour actualiser le parent lors de la fermeture de l'enfant en utilisant

window.opener.location.reload();

dans la fenêtre enfant a provoqué la réouverture de la fenêtre enfant (peut-être à cause de l'état d'affichage, je suppose. Corrigez-moi si je me trompe). J'ai donc décidé de ne pas recharger la page dans le parent et de charger à nouveau la page en lui attribuant la même URL.

Pour éviter de réouvrir la fenêtre contextuelle après la fermeture de la fenêtre contextuelle, cela peut aider

window.onunload = function(){
    window.opener.location = window.opener.location;};
Jitendra Sawant
la source
1

Si votre application s'exécute sur un navigateur compatible HTML5. Vous pouvez utiliser postMessage . L'exemple qui y est donné est assez similaire au vôtre.

Chris Li
la source
"Sinon, vous ne pouvez pas communiquer entre différentes fenêtres." est faux. La technique est toujours possible, bien que je recommande la réponse de @Moses
gengkev
-1 supprimé. Si vous donnez un petit exemple, vous obtiendrez même un +1 ;-)
kay - SE is evil
Ça ne fait rien. Mais je ne pense pas que window.opener soit OK pour IE. J'essaierai.
Chris Li
1
@kay, fonctionne très bien dans IE7, 8. Très bien, je ne le savais pas avant. +1 pour Moïse.
Chris Li
1
@ArMaN: jsfiddle.net/8c2e4/10 , utilisez window.opener. Vous pouvez l'utiliser pour tester votre environnement.
Chris Li
1

Essaye ça

        self.opener.location.reload();

Ouvrez le parent d'une fenêtre actuelle et rechargez l'emplacement.

nmkyuppie
la source
0

Vous pouvez accéder à la page principale avec la commande parent (le parent est la fenêtre) après l'étape, vous pouvez tout faire ...

    function funcx() {
        var result = confirm('bla bla bla.!');
        if(result)
            //parent.location.assign("http://localhost:58250/Ekocc/" + document.getElementById('hdnLink').value + "");
            parent.location.assign("http://blabla.com/" + document.getElementById('hdnLink').value + "");
    }
Hamit YILDIRIM
la source
0

Vous pouvez utiliser le code ci-dessous dans la page parent.

<script>
    window.onunload = refreshParent;
    function refreshParent() {
      window.opener.location.reload();
    }
</script>
muqofa
la source
0

Le code suivant parviendra à actualiser la fenêtre parent après la fermeture:

function ManageQB_PopUp() {
            $(document).ready(function () {
                window.close();
            });
            window.onunload = function () {
                var win = window.opener;
                if (!win.closed) {
                    window.opener.location.reload();
                }
            };
        }
UJS
la source