删除触摸事件的元素

Question

我有一个DIV #overlay坐在DIV＃页面上，但在#page div上，theres a overscroll：auto on一个元素。

当#overlay可见时，如何禁用#page上的所有触摸事件，然后在隐藏了#overlay后启用回来？

<div id="page">touchable content here</div> 
<div id="overlay">sits on top of #page DIV</div> 

这仅适用于移动webkit。

Answer 1

CSS解决方案div#page { pointer-events: none; }

---

jQuery的解决方案

您的触摸事件 -

$('#page').click(function() { 
    if($(this).hasClass('blockEvent')) return false; 
    //do something... 
}); 

时#overlay弹出 -

// display #overlay 
$('#page').addClass('blockEvent'); 

时#overlay关闭 -

// close #overlay 
$('#page').removeClass('blockEvent');