3

我正在尝试检测 mouseup 或 touchend 事件而不触发两次。完整的例子在这里：

<!DOCTYPE html>
<html>
  <head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
    <script>
      $(document).ready(function(){
        $("#t").on("touchend mouseup", function(e){$("body").append(e.type + "<br>"); e.preventDefault();});
      });
    </script>
  </head>
  <body>
    <div id="t" style="position: absolute; left: 200px; width: 200px; height: 200px; background: blue;"></div>
  </body>
</html>

在平板电脑上，首先触发 touchend 事件，然后在延迟后触发 mouseup 事件。所以我包含了 e.preventDefault() 行，它可以根据需要在 iPad 上停止 mouseup 事件。但它对Android没有影响。这两个事件仍然发生。使用“return false”、stopPropagation() 和/或 stopImmediatePropagation() 也没有效果。请注意，我可以只删除 touchend 事件，但我不希望平板电脑延迟等待 mouseup 触发。而且我需要为非平板设备包括 mouseup 。我也不想测试触摸功能，然后取消绑定鼠标支持，因为有人可以拥有一台同时支持触摸和鼠标的笔记本电脑并同时使用它们。我只想让 Android 停止触发 mouseup 事件。

4

3 回答 3

0

我刚刚遇到同样的问题，只能找到一个非常丑陋的解决方案：setTimeout.

http://jsfiddle.net/FjuHu/6/

/**
   * Prevent Android from triggering buggy phantom clicks
   *
   * @param {jQuery} $element
   */
  function preventPhantomClicks($element) {
    /**
     * Click catcher
     * @param {!jQuery.event=} event
     */
    function preventHandler(event) {
      event.preventDefault();
    }

    // catch all events for the next 350ms
    $element.on('click', preventHandler);
    setTimeout(function () {
      $element.off('click', preventHandler);
    }, 350);
  }
于 2013-10-31T21:55:27.307 回答
0

我正在与不需要的事件（例如突然的 android mouseups）搏斗。

由于我正在监听修饰并得到意外的鼠标，我的解决方案是将所有事件传递到过滤器（[node].setEventListener），它将确定我是否希望它们发生，并且我会停止任何我没有希望通过在已批准的事件对象上设置自定义标志，并防止/停止任何缺少它的事件。

我能够通过这种方式避免超时。不优雅，但暂时建立了对系统的更多控制。

于 2013-12-31T17:25:01.003 回答
0

谷歌几年前有一篇关于这件事的文章，称之为 FastButtons。这个实现应该这样做：

https://developers.google.com/mobile/articles/fast_buttons

于 2013-06-27T20:54:40.973 回答