javascript - 停止覆盖下的所有事件

Question

我有一个覆盖 div，它覆盖了一个显示结果的容器 div。但是，当我点击叠加层时，它必须消失。

因此，我尝试在叠加层上设置 pointer-events: none;。但我的问题是叠加层上的点击事件现在不起作用。

实现它的最佳方法是什么？

<div class="overlay container" id="main-div">
  <div id="results-div">
  #Image results are shown and have some events binded to it.
  </div>
</div>


$("#main-div").click(function(){
 #Some events related to it    
});

Answer 1

我猜你可以用这个简单的函数实现你想要的:

$(document).ready (function () {
  $('.overlay').click(function () {
     $('#pop').fadeOut();
  })
})

但是为此您需要更改 HTML 和 CSS:

<div id="pop">
  <div class="overlay" id="main-div"></div>
  <div id="results-div">
    #Image results are shown and have some events binded to it.
  </div>
</div>

查看此演示以查看整个样式 http://jsfiddle.net/USk7U/