跨窗口javascript事件 [英] cross-window javascript events

问题描述

我正在使用window.open(...)启动一个弹出窗口，并将elementId传递给新的弹出窗口.

I am launching a popup window with window.open(...) and I pass an elementId to the new popup window.

然后在启动弹出窗口期间，我在打开器窗口中找到与传递给弹出窗口的elementId匹配的元素.然后，弹出窗口使用jQuery.bind(...)订阅该元素上的事件.然后从打开器窗口中，我使用jQuery.trigger(...)触发这些事件，我还尝试了triggerHandlers.

Then during startup of the popup window I find the element in the opener window that matches the elementId passed to the popup. Then the popup subscribes to events on that element using jQuery.bind(...). Then from inside the opener window I fire these events using jQuery.trigger(...), I also tried triggerHandlers.

问题是我的弹出窗口的eventHandlers从未被调用.我可以从打开器窗口内订阅事件，没有问题.但是，当我从弹出窗口尝试时，它不起作用.

The problem is that my popup's eventHandlers never get called. I can subscribe to the events from within inside the opener window no problem. However, when I try from the popup, it doesn't work.

有人对如何解决此问题有任何想法吗?这是某种安全性说明吗?

Does anyone have any ideas on how to fix this? Is this some kind of security description?

非常感谢您的阅读！

推荐答案

好，当我找到"opener"页面元素并以这种方式分配处理程序时:

OK, when I find the "opener" page element and assign handlers this way:

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

然后，令我惊讶的是，本地真实"事件运行良好. 但是，从打开页面触发的自定义事件不会不会被弹出页面接收.之所以有意义，是因为每个页面都有自己的小jQuery Universe.但是对于浏览器没有传播本机事件，我显然是错的，因此，感谢您今天的学习经验！

Then, to my surprise, native "real" events work just fine. However, custom events fired from the opener page do not get picked up by the popup page. That sort of makes sense, as each page has its own little jQuery universe. I was apparently wrong however about the browser not propagating native events, so thanks for today's learning experience!!

更多信息—在弹出窗口中(以及类似地在主文档的任何子<iframe>中)，您也可以使用

more info — From the popup window (and similarly from any child <iframe> of the main document), you can also use

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

在打开器窗口中查找内容.但是，只需在弹出页面中使用jQuery对象 来发现该元素不起作用，因为jQuery不会遍历"window.opener"链接并在那里寻找该元素.当您在弹出页面上调用$('#thingId')时，jQuery将使用 popup 页面上的document对象调用document.getElementById('thingId').如果该页面上没有名为"thingId"的元素，则找不到该元素.

to find stuff in the opener window. However, simply using the jQuery object in the popup page to find that element cannot work, because jQuery will not traverse the "window.opener" link and go hunting for the element there. When you call $('#thingId') on the popup page, jQuery is just going to called document.getElementById('thingId') using the document object for the popup page. If there's no element called "thingId" on that page, it won't be found.

原始答案:

我认为您要尝试执行的操作不会起作用.浏览器不会在与包含目标元素的窗口不同的窗口中触发任何事件处理程序.

I don't think that what you're trying to do will work. The browser is not going to trigger any event handlers in a window different from the one containing the target element.

但是，您可以在一个窗口中捕获事件，然后在另一窗口中触发自定义事件.当您执行此操作时，可能要通过该页面上的jQuery对象触发事件.换句话说，您可以这样做:

You can, however, catch the event in one window and then trigger a custom event in the other window. When you do that, you're probably going to want to trigger the event through the jQuery object on that page. In other words, you'd do this:

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

这篇关于跨窗口javascript事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！