0

我有一个masked在body标签上调用的自定义类。在页面的中间，我有一个DIV大约 50% 的页面宽度和高度。

我试图仅将单击处理程序附加到body.masked选择器，但问题是每当单击内部时DIV，该选择器上的单击处理程序body.masked也会被触发。

好像DIV中间是“透明的”。我该如何避免呢？

这是一些代码：

$('body.masked').click(function(){
  alert();
})

和 HTML：

<body class="masked">
  <div style="width:50%;height:50%;text-align:center;>Lorem ipsum</div>
</div>
4

1 回答 1

2

这是因为事件冒泡。

它使子元素中发生的事件冒泡到事件树的顶部。这就是为什么它正在发生。

在事件处理程序中，您可以检查该e.target值以检查事件发生的位置。

前任：

$('.top').on('click', function(e){
    console.log(e, e.currentTarget, e.target, this);
    if($(e.target).is(this)){
        console.log('proceed')
    }
})

小提琴

于 2013-01-22T12:34:24.680 回答