jQuery在滚动div时阻止点击事件触发

Question

听起来很容易吧？但我正在使用自定义滚动控件(http://github.com/inuyaksa/jquery.nicescroll),我尝试了大多数使用draggable()时防止这种情况的技巧.但他们没有为此工作...我在这里上传了页面和代码:

演示:http://www.beforethecode.net/blazin 来源:http://www.beforethecode.net/blazin/blazin.zip

这是一个触摸屏项目.到目前为止,我唯一的解决方案是将$ thumbs绑定到'dblclick',以便在拖动鼠标/手指后停止触发......但是我真的希望在滚动停止后单击一下就可以使用它.

Answer 1

您最好的选择将是类似于有多少自动完成工作取消本机事件的解决方案，而是使用超时和标志仅在所需的情况下执行操作：

1. event.preventDefault()相关控件、标签等上的“单击”事件<a />（即不要让任何与触发单击相关的本机浏览器行为发生）。
2. 在防止默认后的“单击”事件上，将单击操作放在一个小值中setTimeout并保存超时句柄。
3. 在“stopdrag”事件中，清除超时句柄；理论上，这将在“单击”事件超时期间发生，并防止在逻辑停止拖动后发生单击，而在实际单击时，不会有停止拖动来取消超时（因此操作将根据需要进行）。

代码：

var clickActionTimeout = null;

function clearClickActionTimeout() {
  if(clickActionTimeout) {
    clearTimeout(clickActionTimeout);
    clickActionTimeout = null;
  }
}

$elem.click(function(e) {
  e.preventDefault();
  clearClickActionTimeout();
  clickActionTimeout = setTimeout(function() {
    // This was a real click if we got here...
    openPicture();
  }, 200);
});

$elem.bind('stopdrag', function() {
  clearClickActionTimeout();
});