避免在绝对定位元素下面点击事件

Question

我有2个元素一个父元素及其子元素，并且都是绝对定位的。

我有一个单击处理程序的每个元素，虽然当我点击子元素后面的父元素也捕获点击。

如何防止父元素接收点击事件？

Answer 1

如果你想要一个纯粹的CSS解决方案，你可以使用pointer-events: none;。这将确保您的鼠标忽略父元素，因此请小心使用它。

另请注意，在IE或Opera中这是NOT SUPPORTED。 （或者至少，不是HTML元素，只是SVG）

jQuery的选择是e.StopPropagation，更多信息可以发现here

Answer 2

您可以使用jQuery和简单有一个preventDefault或return false父元素：

$('#parent').click(function() { 
    return false; 
}); 

$('#child').click(function() { 
    //do something 
});