只有swipeone正在使用jGestures

我正在尝试用jGestures实现触摸平衡。 swipeone工作正常，但其他任何东西（swipeleft，swiperight等）都没有开火。

 
  $('#wrap').bind('swipeleft', function(){ alert("test"); });  

这只是我做的测试页面。 它实际上是在我的主项目中的某个点上工作，但似乎完全停止了，即使我恢复到旧版本也没有。 我尝试过不同版本的jGestures而没有运气。

Answer 1

SwipeLeft，SwipeRight，-Up和-Down都很难实现。 只有在您开始触摸事件的轴上完全停留时，才会触发它们。 例如，只有当手指从（X，Y）（120,0）移动到（250,0）时，SwipeRight才会起作用。

如果起点和终点的Y坐标不同，则不起作用。

jGestures.js（约1095行）最好看起来像这样（可读）：

 /** * U Up, LU LeftUp, RU RightUp, etc. * * \U|U/ * LU\|/RU *L---+---R * LD/|\RD * /D|D\ * */ if ( _bHasTouches && _bHasMoved === true && _bHasSwipeGesture===true) { _bIsSwipe = true; var deltaX = _oDetails.delta[0].lastX; var deltaY = _oDetails.delta[0].lastY; var hor = ver = ''; if (deltaX > 0) { // right hor = 'right'; if (deltaY > 0) { ver = 'down' } else { ver = 'up'; } if (Math.abs(deltaY) < deltaX * 0.3) { ver = ''; } else if (Math.abs(deltaY) >= deltaX * 2.2) { hor = ''; } } else { // left hor = 'left'; if (deltaY > 0) { ver = 'down' } else { ver = 'up'; } if (Math.abs(deltaY) < Math.abs(deltaX) * 0.3) { ver = ''; } else if (Math.abs(deltaY) > Math.abs(deltaX) * 2.2) { hor = ''; } } // (_oDetails.delta[0].lastX < 0) -> 'left' // (_oDetails.delta[0].lastY > 0) -> 'down' // (_oDetails.delta[0].lastY < 0) -> 'up' // alert('function swipe_' + hor + '_' + ver); _oDetails.type = ['swipe', hor, ver].join(''); _$element.triggerHandler(_oDetails.type, _oDetails); } 

Answer 2

试试这个：

 $('#wrap').bind('swipeone', function (event, obj) { var direction=obj.description.split(":")[2] if(direction=="left"){ doSomething(); } }); 

Answer 3

这已在这里得到解答：

有关jGesture滑动事件的stackoverflow

诀窍是：

 … .bind('swipeone swiperight', … 

您必须将它绑定到两个事件。 只有swiperight才行不通。 花了我3个小时来弄清楚：D

最好的，Rico

Answer 4

使用此代码替换版本0.90.1中第1326行的个案

  if ( _bHasTouches && _bHasMoved === true && _bHasSwipeGesture===true) { _bIsSwipe = true; _oDetails.type = 'swipe'; _vLimit = $(window).height()/4; _wLimit = $(window).width()/4; _sMoveY = _oDetails.delta[0].lastY; _sMoveX = _oDetails.delta[0].lastX; _sMoveYCompare = _sMoveY.toString().replace('-',''); _sMoveXCompare = _sMoveX.toString().replace('-',''); if(_sMoveX < 0){ if(_oDetails.delta[0].lastY < _vLimit) { if(_sMoveYCompare < _vLimit) { _oDetails.type += 'left'; } } }else if(_sMoveX > 0){ if(_sMoveYCompare < _vLimit) { _oDetails.type += 'right' } }else{ _oDetails.type += ''; } if(_sMoveY < 0){ if(_sMoveXCompare < _wLimit) { _oDetails.type += 'up' } }else if(_sMoveY > 0){ if(_sMoveXCompare < _wLimit) { _oDetails.type += 'down' } }else{ _oDetails.type += ''; } // alert(_oDetails.type); _$element.triggerHandler(_oDetails.type, _oDetails); } 

Answer 5

你可以试试两个：

 $('#wrap').bind('swipeleftup', function(){ doSomething(); }); $('#wrap').bind('swipeleftdown', function(){ doSomething(); }); 

如前所述，忘记’swipeleft’是很难触发的。

Answer 6

我只是在寻找相同的东西，并想出你可以尝试所有相同的function，如下所示：

 $("#wrap").on('swipeleft swipeleftup swipeleftdown', function(e){ doSomething(); }); 

以及权利的等价物：

 $("#wrap").on('swiperight swiperightup swiperightdown', function(e){ doSomething(); }); 

您可以使用on方法列出多个事件。

Answer 7

我正在使用Willian El-Turk的解决方案：

 // jGestures http://stackoverflow.com/a/14403116/796538 $('.slides').bind('swipeone', function (event, obj) { var direction=obj.description.split(":")[2] if (direction=="left"){ //alert("left"); } else if (direction=="right"){ //alert("right"); } }); 

优秀的解决方案，除了因为它从左到右移动时执行它即使有更多的垂直滑动也非常敏感。 在x轴上有一个最小的滑动距离会很棒。 就像是：

 if (direction=="left" && distance>=50px){ 

除了我不确定如何…请随时编辑此内容！

编辑 – 您可以像这样检查距离（x轴），它适用于我：

 $('.slides').bind('swipeone', function (event, obj) { var xMovement = Math.abs(obj.delta[0].lastX); var direction=obj.description.split(":")[2] //I think 75 treshold is good enough. You can change this. if(xMovement >= 75) { //continue to event //ONLY x axis swipe here. (left-right) if (direction=="left"){ //alert("left"); } else if (direction=="right"){ //alert("right"); } } }