个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
26
4
考虑两个带有“点击”事件处理程序的嵌套 div:
var parent = document.getElementById("parent");
parent.addEventListener("click", function() {
console.log("parent click");
});
var child = document.getElementById("child");
child.addEventListener("click", function() {
console.log("child click");
});<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<div id="parent" style="width:150px;height:100px;border: 1px solid black">
<div id="child" style="width:75px;height:50px;border: 1px solid black"></div>
</div>
</body>
</html> 当点击嵌套元素时，“click”事件“冒泡”，因此控制台中的输出如下所示:
child click
parent click
现在考虑涉及 Hammerjs 的类似示例:
var parent = document.getElementById("parent");
var hammer1 = new Hammer(parent).on("tap", function() {
console.log("parent click");
});
var child = document.getElementById("child");
var hammer2 = new Hammer(child).on("tap", function() {
console.log("child click");
});<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<script src="https://cdnjs.cloudflare.com/ajax/libs/hammer.js/2.0.8/hammer.js"></script>
</head>
<body>
<div id="parent" style="width:150px;height:100px;border: 1px solid black">
<div id="child" style="width:75px;height:50px;border: 1px solid black">
</div>
</div>
</body>
</html>当点击嵌套元素时，控制台输出是相反的(先处理父事件):
parent click
child click
要获得“冒泡”事件顺序，必须在父事件处理程序之前注册子事件处理程序。
有没有办法在不打乱事件处理程序注册顺序的情况下达到同样的效果？
最佳答案
使用 jQuery，这是我成功使用的一个技巧:
通常你会做这样的事情:
$("some_selector").hammer().on('press', handlePress);
但是为了获得 Hammer 事件的正确顺序，这是可行的:
$($("some_selector").get().reverse()).hammer().on('press', handlePress);
这只是让 jQuery 以相反的顺序分配事件的技巧(从叶子 child 向上树到 parent 和 parent parent 等)
关于nested - 嵌套元素的 Hammerjs 事件顺序，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37688640/
26
4
0
我正在尝试运行简单的手势代码，例如在浏览器上点击滑动 var myElement = document.getElementById('myElement'); // cre
我正在为这个正在开发的应用程序使用 Hammer.js v2.0.4。这个想法是，当您点击底部时，会弹出一个模态(模态一)，如果您按下 500 毫秒(或更长时间)，则会显示另一个模态(模态二)。 在桌
我正在尝试添加 HammerJS:http://hammerjs.github.io/api/ 用于动态添加的元素。 Hammer.on('.vc', "tap", function (ev) {
我在 HammerJS 中使用拖动事件来更改输入范围的值。 如果我在每个拖动事件上更改输入范围的值，HammerJS 会持续快速触发它，以至于某些移动设备崩溃。 如何限制拖动事件中的函数调用率？ 最佳
我对 Javascript 知之甚少，但需要在我正在进行的项目中使用 Hammer.js。 我尝试使用拉动刷新脚本来刷新页面，而不是替换/刷新图像。 我尝试添加 location.reload(
我有一个完美工作的 hammerjs 拖动监听器，它可以像我期望的那样捕获拖动。但是，当您放手时，在 dragend 被触发 之后，它也会触发 click 事件。因此，如果您单击以拖动(移动)目标，并
我正在开发这个小网站:Website ;我正在使用 HammerJS 作为触摸支持库。 它似乎在响应事件，并且识别 event.type 属性，但是当我试图获取 event.direction 或其他
考虑两个带有“点击”事件处理程序的嵌套 div: var parent = document.getElementById("parent"); parent.addEventListener("cl
如何区分同一元素上的滑动和拖动？我试过: Hammer(blueDiv).on('swipe', function(e) { e.gesture.stopDetect(); e.gestu
我正在使用 Hammerjs 的 jQuerys 插件。 $('.grab').hammer().on('pan', function(ev){console.info(ev)); //(44) pa
我使用 Hammer.js (v2.0.8) 显示左侧菜单，但同一页面中还有一个轮播(带有 owl carousel v2.3.4)。当我滑动轮播时，菜单也会打开。我尝试了 Hammer.off()
我可以使用 HammerJS 实现发布后拖动吗(以及如何...)？ (我将它与 AngularJS 一起使用，但这无关紧要) 我问的原因是我想实现平滑滚动(就像原生iOS在松开手指后继续滚动) 我相信
所以我有一个标题..和一个图像。在平板电脑上，我希望能够捏合并放大图像，但我很挣扎。我看过其他类似的问题。但由于我仍在学习，我不完全确定我出了什么问题也需要修复。 Title
我正在尝试在不启动旋转手势的情况下启动捏合手势。我的目的是分别启动两个手势。 我已经在我的模块中构建了 hammer 配置，如下所示: import * as Hammer from 'hammerj
编辑:该代码片段在嵌入问题时工作正常，但在编辑时则不然；这让我意识到这与可以滚动的底层容器有关...我在手机上测试了这一点，锤子在没有 overflow 属性的小区域上工作得很好。 我更新了代码片段以
我想用hammerjs手势旋转一个3D对象。 基本上是轮换工作，但有两个问题我无法弄清楚。 旋转方向随机变化。它向左转。我停下来，再次以同样的方式移动手指，突然，它不再继续向左旋转，而是向右旋转。有时
我正在使用在这里找到的 Hammer.js: http://eightmedia.github.io/hammer.js/ 然后我像这样设置/创建 Hammer 对象: var hammertime
我正在使用 ImpactJS 引擎 ( http://impactjs.com/ ) 构建游戏。游戏需要拖动和滑动等手势。因此，HammerJS 被集成到代码中。 在下面的代码片段中，当左键单击绑定(
我正在尝试在 HammerJS 中手动触发该事件，但到目前为止我看不到任何进展。此外，这里还提供了 HammerJS 文档 wiki 版本 1 的链接。 有人可以告诉我如何使用 HammerJS 2.
我将我的 Angular 2 CLI 项目从 1.0.0-beta.11-webpack.2 更新为 1.0.0-beta.11-webpack.8 通过 ng 初始化。我的项目使用 Angular
我是一名优秀的程序员,十分优秀！