如何在JavaScript中使用Hammer.js插件？

Question

我正在使用带有JavaScript的Hammer.js插件库，但它给我抛出了锤子.js文件中的target.addEventListener is not a function错误。我试图上网查找，但找不到适合我的内容。这是我的代码： 我的模板文件：

<div class="class_name">
 <img src="" class="img_test" />
</div>

JavaScript文件：

var ele = document.getElementByClassName('img_test')
var hammer = new Hammer(ele)
hammer.on('tap', function(){
 console.log('image tapped')
})

出于某些原因，我没有使用此插件的CDN版本，而是在本地计算机上创建了其他文件，并从GitHub复制了Hammer.js文件的代码。

当我运行上面的代码时，它给了我addEventListener错误。我到处都看过，但是找不到任何解决方案，所以，我不知道我在做什么错。

我正在使用最新的Google Chrome浏览器。

Answer 1

我使用.each函数和jQuery使它工作。 解决方案：

$('element').each(function(){
 var mc = new Hammer(this)
 mc.on('tap press', function(e) {
  console.log('type: ', e.type)
 })
})

Answer 2

嗯，document.getElementByClassName是不正确的，但是假设您的意思是document.getElementsByClassName（请注意复数“元素”），那么问题是即使一个元素中只有一个带有该课程。

因此var hammer = new Hammer(ele[0])应该可以解决此问题。 而且，如果该类确实包含多个元素，则必须像使用jQuery一样在循环中遍历它们。