如何使用JavaScript将事件侦听器添加到框架窗口？

我试图写一个网站的结构像这样的Chrome扩展：如何使用JavaScript将事件侦听器添加到框架窗口？

<html> 
<head> 
    .... 
</head> 
<frameset> 
    <frame> 
     .... 
    </frame> 
    <frameset> 
     <frame> 
      <html> 
       <head> 
       </head> 
       <body> 
        <select id="theThingIWant"></select> 
       </body> 
      </html> 
     </frame> 
     <frame> 
      .... 
     </frame> 
    </frameset> 
</frameset> 
</html>

我知道这看起来完全疯了，但它是很久以前完成的，它的东西，我在使用工作。我试图访问select元素，但我一直能够这样做的唯一方法是将click侦听器添加到window对象，该对象检查event.target以确保id是我正在寻找的对象。

理想情况下，我想在事件之后触发一个函数，其中Tab键被按下，然后基本上做同样的事情，但我似乎无法触发侦听器，无论我在哪里尝试并附上它。

我的点击事件，做什么，我想：

window.addEventListener('click', function(e) { 
    if (e.target.id === 'selAxisViaAEHybridContent') 
     remove_content_IDs(e.target); 
});

我keydown事件，不工作（控制台日志不会发生）：

window.addEventListener('keydown', function(e) { 
    console.log(e); 
});

我可以访问frame那该select元素使用document.getElementsByTagName('frameset')[1].children[0]，但该.children属性是一个空数组。当我将事件附加到该节点时，它仍然不起作用。有没有人知道我能做些什么来解决这个问题？最终，当select元素通过Tab密钥关注时，我想要运行remove_content_IDs()。

来源

2017-04-18 Eric David Sartor

要绑定在iframe内使用iframe的contentWindow属性。

这可能会有帮助。

var ifr = document.getElementsByTagName("iframe")[0]; 
var ifr_window = ifr.contentWindow; 
ifr_window.addEventListener("keydown", function(e){ 
    console.log("clicked ", e.keyCode); 
});

来源

2017-04-18 16:05:43

这正是我所期待的。你是一个真正的绅士。 –

哦！谢谢你的称赞。 :) –

我实际上有一个后续问题，因为这只是一种解决我的问题：每次我点击框架中的链接，该框架的DOM重新加载，似乎无论我创建的事件监听器当主窗口加载时丢失帧。我怎样才能防止或解决这个问题？ –

如何使用JavaScript将事件侦听器添加到框架窗口？

回答

相关问题