javascript - 将 div 覆盖在传单上并停止鼠标操作传播

Question

如何停止在 div 上单击和滚动并覆盖传单 map 的传播？这似乎很棘手...... 有点像

customPreventDefault(e) {
    e = e || window.event;
    if (e.preventDefault)
        e.preventDefault();
    e.returnValue = false;
}

document.getElementById('no-scrolling-clicking').onmousewheel =
    function (e) {
        document.getElementById('prevent-scrolling').scrollTop -= e.wheelDeltaY;
        customPreventDefault(e);
    }
}

什么都不做。它也需要在 IE 中工作...

http://jsfiddle.net/LnzN2/4888/

Answer 1

将 parent-div 移到 map div 之外。

将您的 HTML 更改为:

<div 
  id="map">

</div>
<div 
  id='parent-div'
  class='some-div'>
   I am the parent! Like the leaflet map, I don't want the mouse events clicking/scrolling bubbling onto me neither.
    <div 
      class='some-div'
      id='no-scrolling-clicking'>
      Stop Scrolling and clicking Event in me! Stop Scrolling and clicking Event in me! Stop Scrolling and clicking Event in me! Stop Scrolling and clicking Event in me! Stop Scrolling and clicking Event in me! Stop Scrolling and clicking Event in me! Stop Scrolling and clicking Event in me! Stop Scrolling and clicking Event in me! Stop Scrolling and clicking Event in me! Stop Scrolling and clicking Event in me!
    </div>
  </div>