使用 Hammer.js 的程序化事件触发器

Programmatic Event Trigger using Hammer.js

本文关键字：事件 触发器 程序化 Hammer js 使用      更新时间：2023-09-26

我发现使用 Hammer.js 创建编程事件非常困难。 我想要的是有两个元素，当点击第一个元素时，我也想在第二个元素上触发或触发或发出一个事件。

我的最终目标是在拖动项目时使用这种技术。 基本上，按住一个元素以创建它的克隆，然后在克隆上发出拖动事件。 这将停止拖动原始元素并开始拖动新的克隆元素。

话虽如此，我创建了一个简单的jsFiddle http://jsfiddle.net/vk3reu0w/1/。 它有两个div 元素。 我正在尝试做的是点击div one，然后事件会自动在div 2 上触发点击事件。

var buttonOne = document.getElementById("one");
var buttonTwo = document.getElementById("two");
var mc1 = Hammer(buttonOne);
var mc2 = Hammer(buttonTwo);
mc1.on("tap", function(event) {
    alert("MC1 Tapped");
    console.log("MC1 Tapped");          
    mc2.emit("tap");            
});
mc2.on("tap", function(event) {
    alert("MC2 Tapped");
    console.log("MC2 Tapped");          
});

任何帮助都非常感谢。 谢谢。

您应该向 .emit 方法添加第二个参数。

 mc1.on("tap", function(event) {
    alert("MC1 Tapped");
    console.log("MC1 Tapped");          
    mc2.emit("tap", event); // HERE           
});

http://jsfiddle.net/Lnvgcupg/1/

您也可以自定义您的活动。

mc1.on("tap", function(event) {
    console.log("MC1 Tapped");          
    var customEvent = JSON.parse(JSON.stringify(event)); // Creating
    customEvent.center.x = 999; // ...changing something
    mc2.emit("tap", customEvent); // Emitting       
});

http://jsfiddle.net/ntgrdq7n/3/

相关文章：