jQuery TouchSwipe插件不适用于链接?

我正在使用jQuery TouchSwipe插件。 它在div上工作得很好,但它在链接上根本不起作用。

我想要它,所以如果你点击或点击链接,你会得到默认的链接行为。 但是,如果你刷卡我想要javascript滑动,就像元素是一个div一样。

https://github.com/mattbryson/TouchSwipe-Jquery-Plugin

多么棒的问题。 为了解决这个问题,我进入了源代码。 您应该知道默认情况下禁用锚点滑动。

version:1.5.0 – 添加了excludedElements,一个jquery选择器,指定不触发滑动的子元素。 默认情况下,这是一个删除所有表单,输入选择,按钮和锚元素 ( 源 )的选择。

默认值:

excludedElements:"label, button, input, select, textarea, a, .noSwipe" 

只需传入excludedElements选项sans the anchor标签,即可在链接上进行滑动操作:

 $("a").swipe({ // Generic swipe handler for all directions swipe: function(event, direction) { $(this).text("You swiped " + direction); }, excludedElements: "label, button, input, select, textarea, .noSwipe" }); 

这个难题还有一个关键。 您不能在内部设置threshold: 0 ,以禁用所有点击/点击事件。 将threshold设置为高于0的任何threshold ,或完全省略。 如果你使它达到threshold: 1 ,它将只允许鼠标点击,否则将解释滑动。

我希望这就是你要找的东西。


演示1 – 手指/鼠标向上检测到滑动

 $(function() { // Enable swiping... $(".test").swipe({ // Generic swipe handler for all directions swipe: function(event, direction) { $(this).text("You swiped " + direction); }, excludedElements: "label, button, input, select, textarea, .noSwipe", threshold:1 }); // Stackoverflow disables snippets opening links, so this captures clicks for a demo $(".test").on("click", function(e){ alert($(this)[0].nodeName + " was clicked"); }); }); 
 .test {font-size: 48px;} 
 Please swipe me

Please swipe me

这不是最佳选择,但您可以使用任何具有类似于链接样式的元素,并像这样处理方向参数。

 $("#swipable").swipe( { swipe:function(event, direction, distance, duration, fingerCount, fingerData) { if (direction == null) { location.href = 'somewhere.html' } else { // Do something else... } }, threshold:0 }); 

这是一个工作示例https://jsfiddle.net/q3gnt8s5/8/

PS。 哈哈注意到这篇文章有多久了,希望它能用到某种方式,哈哈