由于事件的触发时间滞后300毫秒，我有一组绑定到'vmouseup'而不是'click'的列表项。jQuery Mobile - 如何滚动与绑定到vmouseup的项目列表

我的问题是，当我使用'vmouseup'或'vmousedown'绑定每个列表项时，我显然无法通过一些调整来滚动列表。

我的列表元素看看这个：

$(liElem).bind('vmouseup', function() { 
     scrollToTop(); 
     showDetails(); 
});

我怎么能不滚动触发列表元素上vmouseup事件列表？
我记得在SOFlow的某处读到vmouseup不一定总是被触发，所以应该用vmousedown来代替吗？

我想我知道答案的＃1有做unbind()/die()与stopPropagation()轻微的可能性，并preventDefault()

修订ANSWER

在的iOS 4.2.1（iPod Touch的）似乎是与门槛方法错误的东西。如果向上滚动（从顶部向下滑动），但一旦向下滚动（从向下滑动到向上）距离，页面Y通常会给出错误值并触发事件，则一切正常。例如，如果将阈值设置为30像素，并且从手机的底部滑动到顶部，则仍然可以触发该事件。使用jQueryMobile 1.1.0 RC1和jQuery 1.7.1。

来源

2012-04-18 micadelli

var did_user_swipe = false; 
$(liElem).bind('vmousedown', function() { 
    did_user_swipe = false; 
}).bind('vmouseup', function() { 
    if (!did_user_swipe) { 
     scrollToTop(); 
     showDetails(); 
    } 
}).bind('vmousemove', function() { 
    did_user_swipe = true; 
});

默认情况下，该标志设置为false。当用户以滑动的方式拖动手指时，该标志被设置为true。当标志被设置为true时，将不会运行vmouseup事件处理程序。

这里是一个演示：http://jsfiddle.net/RB6mp/

更新

您可以设定刷卡阈值/点击行为为好，这减少了绑定到vmousemove事件的需要：

var coords = [0, 0], 
    threshold = 100;//in pixels 
$(liElem).bind('vmousedown', function (event) { 

    //when the mouse is clicked, set the coordinates of that event 
    coords = [event.pageX, event.pageY]; 
}).bind('vmouseup', function (e) { 

    //when the mouse is released, calculate the distance from the start of the click to the end 
    var distance = Math.sqrt(Math.pow(coords[0] - e.pageX, 2) + Math.pow(coords[1] - e.pageY, 2)); 

    //if the distance of the "swipe" is longer than the `threshold` set 
    if (distance > threshold) { 
     alert('Swipe (' + Math.floor(distance) + 'px)'); 
    } else { 
     alert('Click (' + Math.floor(distance) + 'px)'); 
    } 
});

这里是一个演示：http://jsfiddle.net/RB6mp/4/

来源

2012-04-18 23:56:04 Jasper

哇..那很快..谢谢！知道你潜伏在角落里，碧玉。并且该代码在iPhone和Android中运行正常？ – micadelli 2012-04-18 23:59:07

我正在为你做一个演示，但请注意，我只是更新了答案，以包含'vmousedown'事件来重置标志。 – Jasper 2012-04-19 00:00:08

@micadelli下面是演示：http://jsfiddle.net/RB6mp/1/ – Jasper 2012-04-19 00:01:12

jQuery Mobile - 如何滚动与绑定到vmouseup的项目列表

回答

更新

相关问题