代码之家 › 专栏 › 技术社区 › Gunjan

捕获单击iframe周围的div

event-bubbling event-handling javascript-events javascript

15

Gunjan · 技术社区 · 15 年前

如何在iframe周围的div上捕获click或mousedown事件。我已经尝试将函数附加到div上的click event,但是由于iframe从不将事件冒泡到周围的div上,因此函数从未被调用。有没有一种方法可以捕获div上的事件,然后将其传播到iframe进行默认操作?

3 回复 | 直到 5 年前

1

11

BGerrissen 15 年前

如果单击在iframe区域中,iframe上下文将处理单击事件,它不会跳转到iframe父级。因此,如果click事件发生在iframe区域,div将永远不会注册它。

此外,如果iframe包含与iframe父级不属于同一域的页面,则禁止任何交互(re。 same origin policy

同一原产地政策如果满足,则可以执行以下操作,可以在iframe父上下文中调用方法:

top.parentFunction();

因此,在iframe中添加一个事件监听器,该监听器委托给iframe父级(可通过 top 参考文献。

Diego Perini's NWEvents library . 我相信他的活动系统是其中一个更好的,他在iframe互动特别。

2

6

Brendon 15 年前

没有“好”的方法可以做到这一点,但是如果你真的需要检测Iframe上的点击,你可以在最新的浏览器中进行。

<iframe src="http://mtw-ed.com/" id="iframe" style=""></iframe>

<script type="text/javascript">
var inIframe = false;
function checkClick() {
    if (document.activeElement 
      && document.activeElement === document.getElementById("iframe")) {
        if (inIframe == false) {
            alert("iframe click");
            inIframe = true;
        }
    } else
        inIframe = false;
}
setInterval(checkClick, 200);
</script>

3

0

parliament 10 年前

porthole

Here's their example

然而,我使用了布伦顿的答案,因为它更简单,适合我当前的需要。