preventDefault() 不会停止 Android 上的 mouseup 事件答案

【问题标题】：preventDefault() not stopping mouseup event on AndroidpreventDefault() 不会停止 Android 上的 mouseup 事件
【发布时间】：2013-06-27 20:46:52
【问题描述】：

我正在尝试检测 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 事件。

【问题讨论】：

你可以尝试从回调中返回 false 吗？
@bitoiu，我在帖子中提到了“return false”。它也没有工作。

标签： javascript android jquery

【解决方案1】：

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

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

【讨论】：

我没有实现按钮控件，也没有解释为什么 preventDefault 不能像 iOS 那样在 touchend 上工作。然而，那篇文章中的一件事引起了我的注意，即使用 preventDefault 和 touchstart。如果我在绑定中包含 touchstart，然后在它触发时忽略它，则 preventDefault 会停止 Android 中的鼠标事件。对我来说仍然像一个错误。我有一个旧版本的 Android (2.2.1)，所以从那时起它可能已经修复了。

【解决方案2】：

我刚遇到同样的问题，只能找到一个非常丑陋的解决方案：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);
  }

【讨论】：

【解决方案3】：

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

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

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

【讨论】：