Question

给出以下jQuery代码：

// iPad/Safari doesn't recognize the "click" event using "live", so we have to do some trickery here
var ua = navigator.userAgent, 
    event = ((ua.match(/iPad/i)) || (ua.match(/iPhone/i))) ? "touchstart" : "click";

$(".freeTimeSlot").live(event, function() {
 ...
}

在我的iPhone上，页面比手机显示区域大，所以我触摸屏幕并滚动页面。当我滚动时，如果我的手指恰好位于freeTimeSlot div之一，它会激活click事件。

如何防止这种情况发生？

Answer 1

如果您使用的是jQuery UI，可以尝试 jQuery UI Touch Punch。

如果您不需要将jQuery UI添加到您的页面，这是不值得的，所以也许尝试像这个片段：

$(".freeTimeSlot").on("touchmove",function(e)
{
    e.preventDefault();
    var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0];
    var elem = $(this).offset();
    var x = touch.pageX - elem.left;
    var y = touch.pageY - elem.top;
    if(x < $(this).width() && x > 0)
    {
        if(y < $(this).height() && y > 0)
        {
            // your code...
        }
    }
});

Answer 2

Jquery Mobile使用Vclicks，这比常规点击更好。他们也有触地和修饰。

为什么在滚动屏幕时在iPad / iPhone上调用我的点击事件？

2 个答案: