jQuery 移动点击事件触发 vclick答案

【问题标题】：jQuery mobile tap event fires vclickjQuery 移动点击事件触发 vclick
【发布时间】：2015-08-28 10:13:10
【问题描述】：

我正在创建一个可以在移动设备和 PC 上运行的 jQuery 移动应用程序。我正在使用 jQuery Finger 插件 (http://ngryman.sh/jquery.finger/) 来检测手指事件：

$('body').on('tap', 'image', function(e) {
    console.log(e);
});

问题是点击事件被触发了两次。

[1] v.Event {type: "tap", x: 600, y: 374, orientation: null, end: false…}

[2] v.Event {originalEvent: v.Event, type: "tap", timeStamp: 1440756290573, jQuery183031088717421516776: true, toElement: image#7…}

当我在开发者工具中折叠第二个事件信息时，类型显示“vclick”。

...
shiftKey: false
srcElement: image#7
target: image#7
timeStamp: 1440756501237
toElement: image#7
type: "vclick"
view: Window
which: 1
__proto__: Object
...

如何防止这种情况发生，以便该事件仅运行 jQuery 手指点击事件而不运行 vclick？

【问题讨论】：

你试过e.preventDefault()和e.stopPropagation()或者简单地忽略vclick事件吗？
我都试过了。我不能忽略它，因为我用它来调用一个只应该运行一次的函数。
您可以忽略第一个呼叫或第二个呼叫。或者你可以在第一次调用时收集一些信息，在第二次调用时收集一些信息，然后调用你需要的任何函数。
这些Event 对象有足够的区别来理解哪个是什么并做出决定。或者你可以重写插件——它可能会有所帮助。不过，如果没有人会提供更好的解决方案，请尝试区分事件。
我只看到三种方式： 1. 查看事件信息以了解事件是什么。 2. 以某种方式阻止触发第二个事件。 3. 使用随机数来决定是否处理事件：谁知道——也许你是幸运的。关于第一种方式（即使您不想查看事件）：here is examle 如何根据originalEvent 对事件进行排序。它应该是event.originalEvent，但对于测试用例，它被用作单独的参数。

标签： javascript android jquery ios jquery-mobile

【解决方案1】：

您可以通过检查事件的特定字段来区分事件（忽略它们或进行特殊处理）。

在这种特殊情况下，我看到了 originalEvent 字段的区别。所以只处理第二个事件你可以使用这样的东西（event.originalEvent 被替换为函数的参数originalEvent 用于测试目的）：

$(document).on('tap', function(event, originalEvent) {
    if (originalEvent) {
        console.log('Time to handle event');
        //code code code
    }
    else {
        console.log('Ignoring event');
    }
});

$(document).trigger('tap');
$(document).trigger('tap', ['v.Event']);

&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;

【讨论】：