web-dev-qa-db-fra.com

Détection de l'événement onload d'une fenêtre ouverte avec window.open

 window.popup = window.open($(this).attr('href'), 'Ad', 'left=20,top=20,width=500,height=500,toolbar=1,resizable=0');
 $(window.popup).onload = function()
        {
                alert("Popup has loaded a page");
        };

Cela ne fonctionne pas dans les navigateurs avec lesquels j'ai essayé (IE, Firefox, Chrome). Comment puis-je détecter le moment où une page est chargée dans la fenêtre (comme une surcharge iframe)?

javascriptinternet-explorerfirefoxgoogle-chromepopup
35
Christopher Tarquini

Si le document de la fenêtre contextuelle provient d'un domaine différent, cela n'est tout simplement pas possible.

Mise à jour d'avril 2015: je me trompais: si vous possédez les deux domaines, vous pouvez utiliser window.postMessage et l'événement message in à peu près tous les navigateurs qui sont pertinents aujourd'hui .

Sinon, il n'y a toujours aucun moyen de faire fonctionner ce navigateur croisé sans l'aide du chargement du document dans la fenêtre contextuelle. Vous devez être en mesure de détecter un changement dans la fenêtre contextuelle qui se produit une fois qu'il a été chargé, ce qui pourrait être une variable que JavaScript dans la page contextuelle définit lorsqu'il gère son propre événement load, ou si vous en avez le contrôle, vous pouvez ajouter un appel à une fonction dans l'ouvreur.

19
Tim Down
var myPopup = window.open (...); 
 myPopup.addEventListener ('load', myFunction, false);

Si vous vous souciez d'Internet Explorer, utilisez plutôt la ligne suivante comme deuxième ligne:

myPopup [myPopup.addEventListener? 'addEventListener': 'attachEvent'] (
 (myPopup.attachEvent? 'on': '') + 'load', myFunction, false 
);

Comme vous pouvez le voir, prendre en charge IE est assez lourd et doit être évité si possible. Je veux dire, si vous devez prendre en charge IE = à cause de votre public, faites-le.

50
Delan Azabani

Comme indiqué, la solution https://stackoverflow.com/a/303089 aka Détection de l'événement de chargement d'une fenêtre ouverte avec window.open la solution est idéale:

javascript: /* IE will use 1 ignore 1 w/ error, FF t'other way 'round */
 (function(ow){
   ow . addEventListener(  'load', function(){alert("loaded")}, false);
   ow .      attachEvent('onload', function(){alert("loaded")}, false);
  }(window.open(Prompt("Where are you going today?",location.href),"snapDown")))

Cependant, d'autres commentaires et réponses perpétuent plusieurs idées fausses erronées, comme expliqué ci-dessous.

Le script suivant démontre l'inconstance temporelle capricieuse de la définition de onload. Appliquer le script à un chargement rapide location.href tel que file:/// et un site lent pour voir le problème. Il est possible de voir le message onload ou aucun message (en rechargeant une page chargée, les 3 variantes peuvent être vues). Il est également supposé que la page en cours de chargement ne définit pas un événement onload qui aggraverait le problème.

Les définitions du gestionnaire d'événements de onload ne sont certainement pas "dans le balisage HTML de la popup" bien qu'elles résideront finalement dans le DOM du body ... du HTML.

javascript:
window.popup=window.open(location.href,'snapDown');
window.popup.onload=function(){alert("message one ")};
alert("message 1 maybe too soon\n"+window.popup.onload);
window.popup.onload=function(){alert("message two")};
alert("message 2 maybe too late\n"+window.popup.onload);

ce que tu peux faire:

  • ouvrir une URL étrangère
  • sur cette URL étrangère p. barre d'adresse entrez un javascript: ... URI
    il héritera des mêmes règles de site que l'URL étrangère
    NB. le javascript peut nécessiter d'être mis en signet en tant que bookmarklet depuis la barre d'adresse URI javascript: ne sont pas efficaces dans les navigateurs récents (vers 2012)
  • cela donne effectivement accès à plusieurs domaines, mais notez:
    1. le javascript n'est pas indigène à une page Web ou à un site, ce qui signifie que son origine a une nationalité sans état et satisfait donc intrinsèquement css (script x-site) et sop (même politique d'origine) règles d'immigration
    2. il est invoqué manuellement via la barre d'adresse ou les signets ET
      le script est entré manuellement dans ces emplacements

Ainsi n'importe quelle page, enfin presque, quelle que soit son origine, peut être modifiée comme:

javascript:
  if(confirm("wipe out links & anchors?\n"+document.body.innerHTML))
     void(document.body.innerHTML=document.body.innerHTML.replace(/<a /g,"< a "))

(enfin presque ...
jar:file:///usr/lib/firefox/omni.ja!/chrome/toolkit/content/global/aboutSupport.xhtml
La page de dépannage FF de Mozilla et les autres archives jar sont des exceptions)

Comme autre exemple:
Pour désactiver systématiquement l'usurpation par Google de la page cible. frappe, changez sa fonction rwt comme suit:

javascript:void(rwt=function(unusurpURL){return unusurpURL})

et marquez-le comme spay google (neuteralize google?) c'est à dire. c'est réparé".

Ce signet est ensuite cliqué avant de cliquer sur n'importe quel google hits, donc les signets de l'un de ces hits sont propres et non les aberrations perverties mal corrélées que google en a faites.

tests effectués avec

window.navigator.userAgent=
Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:11.0) Gecko/20100101 Firefox/11.0

Il convient de noter que addEventListener dans Mozilla n'a qu'un quatrième paramètre booléen non standard qui , si true permet d'instancier des déclencheurs de contenu non fiables pour les pages étrangères.

réf:
element.addEventListener | Modèle d'objet de document (DOM) | MDN:
Interaction entre les pages privilégiées et non privilégiées | Extraits de code | MDN:

Signet:
Détection de l'événement onload d'une fenêtre ouverte avec window.open

6
ekim

Cela a fait l'affaire pour moi; exemple complet:

HTML:

<a href="/my-popup.php" class="import">Click for my popup on same domain</a>

Javascript:

(function(){
    var doc = document;

    jQuery('.import').click(function(e){
        e.preventDefault();
        window.popup = window.open(jQuery(this).attr('href'), 'importwindow', 'width=500, height=200, top=100, left=200, toolbar=1');

        window.popup.onload = function() {
            window.popup.onbeforeunload = function(){
                doc.location.reload(true); //will refresh page after popup close
            }
        }
    });
})();
3
Sebastiaan Ordelman

onload le gestionnaire d'événements doit être dans le code HTML de la fenêtre <body> balisage.

1
Thevs

Le problème principal semble être que vous ouvrez une fenêtre pour afficher une page dont le contenu est déjà mis en cache dans le navigateur. Par conséquent, aucun chargement ne se produit et donc aucun événement de chargement ne se produit.

Une possibilité pourrait être d'utiliser à la place l'événement 'pageshow', comme décrit dans:

https://support.Microsoft.com/en-us/help/3011939/onload-event-does-not-occur-when-clicking-the-back-button-to-a-previo

0
Panu Logic