Fenêtre contextuelle DOM vide

J'ai une fenêtre qui doit s'étendre sur plusieurs cadres, donc j'utilise window.createPopup pour que cela fonctionne. (IE6, 7 et 8.)Fenêtre contextuelle DOM vide

est la fonction ci-dessous j'utilise pour créer le menu contextuel:

function ShowMyPopup() { 
    notificationPopup = window.createPopup(); 
    $(notificationPopup.document.body).load("/notification.html"); 
    notificationPopup.show($(sourceFrame.document.body).width() - 510, $(sourceFrame.document.body).height() - (510 - $(sourceFrame.document.body).height()), 500, 500, sourceFrame.document.body); 
}

Cela semble fonctionner assez bien. Je vois la fenêtre popup comme je devrais. Le problème est, peu importe ce que je fais, je ne peux pas sembler accéder à l'un des éléments DOM dans la fenêtre contextuelle qui en résulte. J'ai essayé diverses méthodes de jQuery aussi bien qu'un getElementById direct, et tout renvoient NULL. Ci-dessous le contenu de notification.html:

<html> 
<head> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      alert($(document).html()); 
      alert($("#divNotification").html()); 
      alert(document.getElementById("divNotification")); 
     }); 
    </script> 
</head> 
<body> 
    <div id="divNotification" onclick="$(this).toggle();"> 
     <h3>Some Notification!</h3> 
     Testing 1234... 
    </div> 
</body> 
</html>

Je vois trois alertes, donc je sais que jQuery fonctionne, mais les trois alertes simplement montrer « NULL ». Si je clique sur la div résultante, onClick se déclenche mais j'obtiens une erreur "Object Expected".

Que se passe-t-il ici?

Source

2012-04-16 RMD

Dans votre démonstration, jQuery n'est pas inclus. –

Vous essayez d'obtenir le code HTML du document en utilisant '$ (document) .html()'.Vous devriez utiliser '("html"). Html()'. Cela provoque la première alerte à renvoyer null. Les deux autres peuvent être causés par le DOM n'étant pas prêt au moment où vous essayez d'y accéder. Essayez d'ajouter un délai pour les retarder. –

Rob - jQuery est inclus dans la page parente, qui apparents lui permet de travailler dans la popup. (Ou peut-être pas?) En tout cas, cela ne fait aucune différence si j'ajoute aussi une balise script à ref jQuery dans notification.html – RMD

Ok. J'ai compris ça. C'est plutôt contre-intuitif. Fondamentalement, j'ai fini par charger toutes les bibliothèques javascript pertinentes dans le cadre source. Je dois ensuite référencer explicitement le cadre source par son nom afin d'accéder à ces méthodes. Si vous avez un javascript - même javascript à l'intérieur la fenêtre contextuelle - veut accéder au DOM de la fenêtre popup, vous devez le qualifier complètement (ou fournir à jQuery l'objet racine correct) pour qu'il fonctionne.

Par exemple, voici mon nouveau notification.html:

<div id="divNotification" onclick="top.SourceFrame.MakePopupRed();"> 
    <h3>Some Notification!</h3> 
    Testing 1234... 
</div>

Maintenant, dans mon FRAME source javascript bibliothèque référencée:

function MakePopupRed() { 
    if (notificationPopup) { 
     $("#divNotification", notificationPopup.document).css("background-color", "red"); 
    } 
}

Donc, au fond, il semble que le javascript qui est exécuter dans un popup créé à partir de window.createPopup s'exécute dans le contexte de la fenêtre parente, plutôt que la fenêtre popup elle-même!

Source

2012-04-17 18:37:16 RMD

Vous avez raison, c'est contre-intuitif. Félicitations pour le travail. En pratique, il devrait être plus facile de résumer le popup avec par exemple. 'var $ nPopup = $ (" notificationPopup.document ");' dans chaque image (comme requis) et pour attacher les gestionnaires d'événements du popup en javascript à partir de là, en utilisant '$ nPopup' comme contexte. Attacher des gestionnaires dans js est généralement une meilleure pratique que l'approche HTML PLUS, dans ce cas, évite d'avoir à utiliser le 'top.SourceFrame. ... 'notation dans le popup pour adresser les membres js dans les cadres réguliers. –

Selon this reference, avec window.createPopup() "les scripts doivent affecter du contenu (pas une URL externe) à l'objet contextuel retourné par la méthode".

Si vous souhaitez attribuer un contenu à une URL externe, vous devez utiliser la méthode non propriétaire (navigateur croisé) window.open().

Avec window.open(), la communication entre la fenêtre principale et la fenêtre contextuelle peut toujours être effectuée.

En supposant que la fenêtre à ouvrir avec var myPopup = window.open(...);, puis:

fenêtre principale adresse contextuelle comme myPopup
adresses Popup fenêtre principale comme opener

Source

2012-04-16 20:12:20

Je n'attribue pas d'URL externe. Je charge le contenu de cette URL externe via jQuery et j'assigne ce contenu à la fenêtre contextuelle. – RMD

Oui, bien sûr, je vois maintenant. Doh! –

Fenêtre contextuelle DOM vide

Répondre

Questions connexes