Question

我使用JavaScript并制作HTML5游戏。

我用按钮买东西。遗憾的是我无法使用ontouchstart='function()'作为我的按钮，因此我使用了touchstart事件监听器，并等待用户点击按钮（使用按钮的ID指定）。

document.addEventListener("touchstart", function() {
  if (event.target.id === "button") {
        clicks++;
    }
}

我注意到，因为苹果（我在带有手机屏幕的iphone 6s上测试）有300毫秒的延迟，如果用户慢慢点击按钮，它将执行初始点击功能（在总量中加1）点击），然后它再次执行该功能（就像按下按钮两次）。我可以期待这个，因为我有另一个事件监听器，仅用于＆＃34;点击＆＃34;如果用户有计算机而不是智能手机。

切入追逐，我需要的是一种禁用第二次点击的方法。

基本上，点击次数增加1（从0到1），然后您会在按钮上看到点击动画，并且总点击次数再次增加1（从1到2）。 touchstart事件监听器正在引发初始添加（我想要的）。然后点击按钮的副作用是第二次点击按钮而无需进一步的用户输入。

我想找到一种方法来禁用第二次点击部分，但请保持点按。

所以也许是这样的事情：

document.addEventListener("touchstart", function() {
  // disable 2nd click or clicking all together, only allowing touch events
        clicks++;
    }
}

我希望我解释得很好，如果需要可以随意提出更多问题。

Answer 1

首先，看看@ https://developers.google.com/web/updates/2013/12/300ms-tap-delay-gone-away - 如果你还没有 - 来规避这个300毫秒的问题。

如果情况并非如此，并且你想做一些hackish，也许可以试试

let lastclick = + new Date()
let clicks = 0

document.addEventListener("touchstart", () => {
  if (+ new Date() - 100 > lastclick) {
    clicks++
    lastclick = + new Date()
    console.log(clicks)
  }
})

防止点击同时发生（在接受第二次点击之前需要至少100毫秒分开）

只使用javascript

1 个答案: