jquery mobile tap 事件触发一次然后导致问题答案

【问题标题】：jquery mobile tap event fires once then causes problemsjquery mobile tap 事件触发一次然后导致问题
【发布时间】：2012-03-03 20:59:09
【问题描述】：

我有一个绑定到图像的点击事件。点击图像时文档应滚动。在带有 iOS5 的 ipad 上，该功能在第一次点击图像时可以正常工作，但如果用户连续第二次点击该图像，则该功能会失败。如果用户持续点击该函数似乎会再次触发，但无法滚动函数中定义的完整像素距离。

如果用户点击图像，触摸屏幕以物理滚动页面，然后再次点击图像，该函数应按原样触发。为什么我的代码在第二种情况下有效，但在第一种情况下无效？非移动版本运行良好。

<script type="text/javascript">
    $(window).load(function () {
        $('#down_button').bind('tap', function() {
            $.scrollTo( '+=1024px', {axis: 'y', duration:300} );
        });

        $('#up_button').bind('tap', function() {
            $.scrollTo( '-=1024px', {axis: 'y', duration:300} );
        });
    });
</script>

【问题讨论】：

双击“用户连续第二次点击图像”是什么意思？还是在文档完成滚动后再次点击？
尝试不使用 window.load 包装器

标签： jquery ipad jquery-mobile scrollto

【解决方案1】：

您没有显示关联的 HTML，所以我猜测其中一个元素可能嵌套在另一个元素中。

如果是这种情况，那么点击事件可能会冒泡。您可以通过将 event.stopPropagation() 添加到一个或两个事件处理程序来防止这种情况发生。这还需要您更改要传递事件的函数，如下所示：

.bind('tap', function(event) {

【讨论】：

我必须在某个时候尝试一下。我实际上使用的是固定宽度的文档，最终我读到固定宽度的文档不支持移动 webkit 中的滚动，所以我认为这是问题所在。虽然很奇怪，但我可以通过滚动来工作。