将事件侦听器添加到iframe

Question

是否可以向iframe添加事件监听器？我已经尝试过这段代码,但它似乎不起作用:

document.getElementsByTagName('iframe')[0].contentWindow.window.document.body.addEventListener('afterLayout', function(){
                console.log('works');
            });

我也尝试过使用id获取元素并通过我正在使用的JavaScript框架添加我的监听器,如下所示:

Ext.fly("iframeID").addListener('afterLayout', function(){ alert('test'); });

我可以在iframe中调用函数,所以我认为安全性不是问题.有任何想法吗？

Answer 1

我从未试图处理'afterLayout'事件,但是对于更多与浏览器兼容的代码,您将使用(iframe.contentWindow || iframe.contentDocument)代替iframe.contentWindow.

尝试类似的东西

var iframe = document.getElementsByTagName('iframe')[0],
    iDoc = iframe.contentWindow     // sometimes glamorous naming of variable
        || iframe.contentDocument;  // makes your code working :)
if (iDoc.document) {
    iDoc = iDoc.document;
    iDoc.body.addEventListener('afterLayout', function(){
                        console.log('works');
                });
};

希望它会有所帮助.

Answer 2

失败的原因可能是：-

1. iframe 从与容器不同的域定向到的 URL，因此可以通过跨域脚本阻止来阻止代码。
2. 代码在加载框架内容之前运行