如何使用Hammer.js 2.0停止传播()?

Eri*_*ric 7 javascript jquery stoppropagation hammer.js

我有一个父母和孩子div.平移/拖动孩子不应该影响父母. 这是一个类似的问题,但一年前被问到,我正在使用更新版本的Hammer.js w/jQuery包装器.

我的假设是我必须以某种方式停止传播()但我不确定如何使用它.

我嘲笑了一个演示我在JsFiddle问题的演示.我也评论过我试过的几件事.

$(".outer-box").hammer().bind("panright", function(event){
    // do stuff when panning
    // panning here should move both boxes
});
$(".outer-box").hammer().bind("panend", function(event){
    // do stuff when panning ends
});

$(".inner-box").hammer().bind("panright", function(event){
    // do stuff when panning
    // panning here should only affect the inner box
});
$(".inner-box").hammer().bind("panend", function(event){
    // do stuff when panning ends
});
Run Code Online (Sandbox Code Playgroud)

有什么建议或提示吗?谢谢!

gtz*_*lla 7

在Hammer 2.0.6中,正如其他人已经回答的那样,你可以打电话event.srcEvent.stopPropagation().有一点需要注意,您必须domEvents=true根据文档进行设置.

Hammer能够使用domEvents:true选项触发DOM事件.这将为您的方法提供stopPropagation(),因此您可以使用事件委派.哈默不会解除约束事件的束缚.

示例代码

var mc = new Hammer.Manager(elem);
mc.options.domEvents=true; // enable dom events
var pinch = new Hammer.Pinch();
mc.add(pinch);
mc.get('pinch').set({ enable: true });
mc.on("pinch",function(e){e.srcEvent.stopPropagation();});
Run Code Online (Sandbox Code Playgroud)

要么

var hammertime = new Hammer(elem);
hammertime.domEvents = true;
hammertime.on("panstart", function(e){e.srcEvent.stopPropagation();});
Run Code Online (Sandbox Code Playgroud)

此技术列在文档的提示页面上,此处为http://hammerjs.github.io/tips/


小智 5

试试event.srcEvent.stopPropagation()。Hammer 将自身包裹在本机事件对象周围;srcEvent使您可以访问事件对象的“通常”可供性。