Cross-Fenster Javascript Ereignisse

Question

Ich starte ein Popup-Fenster mit window.open (...) und ich übergebe eine ElementId an das neue Popup-Fenster.

Dann beim Start des Popup-Fensters finde ich das Element im Eröffnungsfenster, das mit der Element-ID übereinstimmt, die an das Popup übergeben wurde. Dann abonniert das Popup Ereignisse für dieses Element mit jQuery.bind (...). Dann feuere ich diese Ereignisse aus dem Opener-Fenster mit jQuery.trigger (...) und triggerHandlers aus.

Das Problem ist, dass die eventHandlers meines Popups nie aufgerufen werden. Ich kann die Veranstaltungen von innerhalb des Opener-Fensters aus problemlos abonnieren. Wenn ich es jedoch über das Popup versuche, funktioniert es nicht.

Hat jemand irgendwelche Ideen, wie man das beheben kann? Ist das eine Art Sicherheitsbeschreibung?

Vielen Dank für das Lesen!

Answer 1

OK, wenn ich das „Opener“ Seitenelement und weise Handler auf diese Weise finden:

// in the popup page 
$(function() { 
    var openerElement = window.opener.document.getElementById(theElementId); 
    $(openerElement).click(function() { 
    alert("Hello World!"); 
    }); 
}); 

Dann zu meiner Überraschung, native „echte“ Ereignisse gut funktionieren. jedoch, benutzerdefinierte Ereignisse aus der Opener-Seite gefeuert tun nicht werden von der Popup-Seite abgeholt. Das macht Sinn, da jede Seite ihr eigenes kleines jQuery-Universum hat. Ich habe mich jedoch anscheinend geirrt, dass der Browser keine nativen Ereignisse verbreitet, also danke für die heutige Lernerfahrung !!

weitere Informationen — im Popup-Fenster (und in ähnlicher Weise von jedem Kind des Hauptdokuments), können Sie auch

var thing_in_main_window = window.opener.$('#thingId'); 

verwenden Sachen im Opener Fenster zu finden. Verwenden Sie einfach das jQuery-Objekt in der Popup-Seite, um zu finden, dass das Element nicht funktionieren kann, weil jQuery den Link "window.opener" nicht durchläuft und nach dem Element dort sucht. Wenn Sie auf der Popup-Seite $('#thingId') aufrufen, wird jQuery einfach document.getElementById('thingId') mit dem document Objekt für die Popup Seite aufgerufen. Wenn auf dieser Seite kein Element namens "thingId" vorhanden ist, wird es nicht gefunden.

ursprüngliche Antwort:

Ich glaube nicht, dass das, was Sie versuchen, arbeiten zu tun. Der Browser wird keine Event-Handler in einem anderen Fenster als dem mit dem Zielelement auslösen.

Sie können das Ereignis jedoch in einem Fenster abfangen und dann im anderen Fenster ein benutzerdefiniertes Ereignis auslösen. Wenn Sie das tun, werden Sie wahrscheinlich das Ereignis über das jQuery-Objekt auf dieser Seite auslösen wollen. Mit anderen Worten, Sie würden dies tun:

$('#thing').click(function() { 
    otherWindow.jQuery.trigger("thing-clicked"); 
}); 

Answer 2

Dank Pointy für die Antwort. Ich habe damit experimentiert und möchte meine Erkenntnisse teilen.Sie können tatsächlich Ihre Event-Listener im Popup-Fenster definieren, ohne den Opener Referenzierung:

in der Seite als Popup geöffnet:

$(document).on("foo", function() { 
    alert("foo"); 
}); 

auf der Seite, die das Popup öffnet:

var popup = window.open("popup.html", "_blank", "width=500"); 
$("#trigger-button").on("click", function() { 
    popup.$(popup.document).trigger("foo"); 
}); 

Das Geheimnis ist: selbst wenn Sie jQuery aus dem Popup-Fenster-Objekt aufrufen, können Sie Selektoren nicht direkt verwenden, weil jQuery versucht, Elemente im übergeordneten (Öffner) Fenster zu finden.