如何解决被触发两次的点击事件？

Question

• 我有一个单页应用程序。
• 它使用backbone.js。
• 通过鼠标触发单击事件一次。
• 通过触摸设备触发两次点击事件。
• 取消绑定一键事件在触摸设备上都停止。

我不知道从哪里开始寻找。

这是JS：

$('.classy').on('click', 'button', function(){
    console.log('clicked');
})

我需要一些帮助来弄清楚如何解决这个问题。我知道我没有提供足够的信息来获得真正的答案。令我困惑的是，这只发生在触摸设备上。如果我不小心绑定了两个事件或创建了同一视图的两个实例，那么鼠标点击也不会发生这种情况吗？

谢谢。

编辑：我尝试通过 jQuery Mobile 使用点击事件。这引起了奇怪的反应。它会触发一次事件并且看起来已经完成了，但是下次您触摸屏幕上的任何位置时，它会再次触发该事件。 ...奇怪，有什么想法吗？

我终于找到了问题所在。它来自分层 iScrolls。此时我不得不破解库，这可能是解决此问题的更好方法，但说明了这一点。

if (target.tagName != 'SELECT' && target.tagName != 'INPUT' && target.tagName != 'TEXTAREA' && window.iScrollClickFIX != true) {                        
    window.iScrollClickFIX = true;
    setTimeout(function(){
        window.iScrollClickFIX = false;
    }, 1)

感谢大家的帮助。

Answer 1

这可能不是实际的解决方案...只是考虑一下

$('.classy').die('click').on('click', 'button', function(){ 
    console.log('clicked'); 
}) 

Answer 2

尝试将您的绑定更改为mousedown 而不是click？

（假设您使用的是click）

Answer 3

也许您还为另一个父元素分配了一个点击处理程序。试试这个，以防止点击（或任何其他事件）冒泡 DOM：

$('.classy').on('click', 'button', function(e){
    console.log('clicked');
    e.stopPropagation();
})

Answer 4

解决问题的第一件事是在 Chrome/IE/Firefox 中使用调试器设置断点，以确保绑定不会发生两次。

或者试试这个：

$('.classy').off('click').on('click', 'button', function(){
    console.log('clicked');
})

Answer 5

您可以使用jquery的one功能代替click来摆脱双击问题。