7

我编写了一个应该在移动设备上运行的 html5 应用程序。90% 的时间它可以正常工作，但是在某些设备（主要是 androids 4.0+）中，点击事件会触发两次。

我知道为什么会发生这种情况，我使用iScroll 4来模拟原生滚动，它处理滚动内部发生的事件。（如果您有兴趣，第 533 行会调度事件）大多数时候它工作正常，但在某些设备中iScroll 调度事件和附加到元素的原始 onClick 事件都被触发，因此单击发生了两次。我找不到发生这种情况的设备的模式，所以我正在寻找替代方法来防止双击。

我已经想出了一个丑陋的解决方案来解决这个问题。我已经将所有点击都包含在一个“handleClick”方法中，该方法的运行时间不允许超过 200 毫秒。这变得非常难以维护。如果我有动态生成的内容，它会变得一团糟，当我尝试将对象作为参数传递时，情况会变得更糟。

var preventClick = false;

function handleClick(myFunction){

   if (preventClick)
      return;
   setTimeout(function(){preventClick = true;},200);

   myFunction.call():
}

 function myFunction(){

  ...

 }

<div onclick='handleClick(myfunction)'> click me </div>

我一直在尝试找到一种方法来拦截整个页面中的所有点击事件，并且以某种方式确定是否应该触发该事件。有可能做这样的事情吗？

在点击时设置 myFunction 但在它被调用之前，触发handleClick()？我目前正在玩自定义事件，它看起来很有希望，但我不想更改整个应用程序中的每个事件。

<div onclick='myfunction()'> click me </div>
4

2 回答 2

8

你可以用以下方法做到这一点（虽然我不推荐它）：

$('body').on('click', function(event){
  event.preventDefault();
  // your code to handle the clicks
});

这将阻止浏览器中的默认点击功能，如果您想知道点击的目标，只需使用event.target. 有关如何在 preventDefault(); 之前添加点击检查的想法，请参阅此答案。

于 2013-10-18T12:18:38.657 回答
0

我不喜欢关于属性的事件，但这只是我。

思考 jquery：$(selector).click(function(){ <your handler code> }你可以这样做：

$(selector).click(function(event){
    handleClick(window[$(this).attr("onclick")]);
};

当然，不会有任何参数...

于 2013-10-18T12:24:10.597 回答