当使用hammer.js默认的“doubletap”时
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<title>Document</title>
<style media="screen">
.box {
width: 400px;
height: 400px;
background-color: green;
}
</style>
</head>
<body>
<div class="box">
</div>
<script src="js/hammer.js" charset="utf-8"></script>
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function () {
var myElement = document.querySelector('.box')
var hammer = new Hammer(myElement)
hammer.on('doubletap', function (e) {
console.log(e.type)
}).on('tap', function (e) {
console.log(e.type)
})
})
</script>
</body>
</html>
当我双击时，它打印“tap”两次，“doubletap”一次，但我希望它只打印“doubletap”，而不触发“tap”。
我尝试 requreFailure http://hammerjs.github.io/require-failure/和 Hammer.js : How to handle / set tap and doubletap on same elements
所以我这样写:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<title>Document</title>
<style media="screen">
.box {
width: 400px;
height: 400px;
background-color: green;
}
</style>
</head>
<body>
<div class="box">
</div>
<script src="js/hammer.js" charset="utf-8"></script>
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function () {
var myElement = document.querySelector('.box')
var hammer = new Hammer(myElement)
var singleTap = new Hammer.Tap({ event: 'singletap' });
var doubleTap = new Hammer.Tap({event: 'doubletap', taps: 2 });
hammer.add([doubleTap, singleTap]);
doubleTap.recognizeWith(singleTap);
singleTap.requireFailure([doubleTap]);
hammer.on('doubletap', function (e) {
console.log(e.type)
}).on('singletap', function (e) {
console.log(e.type)
})
})
</script>
</body>
</html>
但是它没有console.log任何东西(甚至是错误消息)，这真的很奇怪。锤子的版本是2.0.8。抱歉我的英语不好，希望我说得清楚。
最佳答案
尝试使用
var hammer = new Hammer.Manager(myElement);
而不是
hammer = new Hammer(myElement).
再见。
关于javascript - Hammer.js 无法处理/设置相同元素上的点击和双击，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38090088/