jQuery防止点击事件从滚动div时触发

听起来很容易吧？但我正在使用自定义滚动控件（http://github.com/inuyaksa/jquery.nicescroll），并且我尝试了大多数使用draggable（）时所预见的技巧。但他们不是在为这个...我上传的页面，在这里代码：jQuery防止点击事件从滚动div时触发

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

这是一个触摸屏项目。到目前为止，我唯一的解决方案是将$ thumbs绑定到'dblclick'，所以它会在拖动鼠标/手指后停止触发......但是我真的很希望在滚动停止后只需点击一下就可以使它工作。

来源

2012-05-29 bfritz

请问您可以在jsfiddle.net（或类似的东西）上提供您的问题的缩小版本，以便我们轻松修补它。谢谢。你有没有尝试过jquery mobile，它内置了对触摸事件的支持？ – Imperative

你需要考虑当你的手指碰到屏幕并离开它时发生的每一个事件。你需要开发更多（代码，问题，小提琴示例） – TecHunter

你最好的选择将是多少自动完成工作，取消本地事件，而是在需要的情况下，使用超时和标志只有行为类似的解决方案：

event.preventDefault()“click”事件的相关控制，<a />标签等等（即不要让任何本地浏览器行为发生与触发点击相关）。
在防止默认设置后点击“事件”，将点击操作放在一个小的setTimeout中并保存超时句柄。
在“stopdrag”事件中，清除超时句柄;理论上这将在“click”事件超时期间发生，并防止在逻辑stopdrag之后发生点击，而在真正的点击上将不会有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(); 
});

来源

2013-05-29 09:57:37

其实，现在我想到了，“点击”变量是不必要的;超时句柄足以控制行为。我编辑了我的评论。 –

我不同意这个库工作，但也许这可以帮助你。作为获得，它不适用于移动设备，它适用于触摸屏。所有的工作在我的手机上都很好，滚动是可以的。

你有一些配置属性，其中一些看起来只是满足你的需要。这里有一些：

。 touchbehavior - 在台式电脑中启用光标拖动滚动，如触摸设备，默认为false

。 cursordragontouch，拖动光标，触摸/ touchbehavior模式也（默认：false）

https://github.com/inuyaksa/jquery.nicescroll/blob/master/README

我没有看到你的代码，你的链接被打破，也许你已经知道了这个特性。但是，如果没有，希望这会帮助你。这只是找到一个母马窝。

来源

2013-06-04 22:09:14

我不知道如何管理触摸事件。然而，这是我如何做它的点击事件，我想这是没有太大的不同http://jsfiddle.net/USvay/

这个想法是为了防止点击事件，而不是你的欲望功能将激发mouseup如果一定时间有或没有通过。

var clicked = true, 
    tOut; 

$('a').on('click', function (e) { 
    e.preventDefault(); 
}).on('mousedown', function() { 


    tOut = setTimeout(function() { 
     clicked = false; 
    }, 200); 



}).on('mouseup', function() { 

    if (clicked == true) { 
     clearTimeout(tOut); 
     my_function(); 

    } else { 
     clicked = true; 
     $('<p>Dragged</p>').appendTo('#result'); 
    } 

}); 

function my_function() { 
    $('<p>Clicked</p>').appendTo('#result'); 
}

来源

2013-06-05 05:10:57 Alvaro

你试过：

event.stopPropagation()

这里的reference on this function。

来源

2013-06-05 07:10:33 Lenin

jQuery防止点击事件从滚动div时触发

回答

相关问题