javascript - 区分 JavaScript 事件

Question

在 JavaScript 中区分事件的最佳方法是什么。

实际上有两点我感兴趣。第一点是事件中是否有类似 id 的东西(这对于调试目的非常有用)。另一点是有更好的方法来区分 mousedown 和 mousedown&touchstart 事件。

让我告诉你我的故事。我遇到的问题是，如果您向具有触发器 mousedown 和 touchstart 的节点添加两个 dom 事件，那么在移动设备上都会 mousedown 和 touchstart 运行。

我找到的第一个解决方案是运行

event.preventDefault();
event.stopPropagation();

在每个监听器函数的开头。

但是后来我发现了一种事件委托(delegate)模式并开始使用分析，所有这些都不允许使用以前的方法，所以我提出了以下解决方案:

let lastEvent = null;
const specificListener = function(e) {
  if (lastEvent === e) {
    return; //already run the code due to another listener
  }

  /*
  logic goes here
  */ 

  lastEvent = e;
};

现在我感兴趣是否可以以不同的方式比较事件(与 event1 === event2 不同，希望找出类似 event1.id === event2.id 的内容)？

谢谢。

Answer 1

不要尝试区分事件，只需订阅 mousedown 即可，因为它无论如何都会被触发。这是我想说的最简单的解决方案。

或者，您可以尝试检测支持哪种事件系统并仅订阅适当的事件系统:

var eventType = document.ontouchstart != null ? 'touchstart' : 'mousedown';

document.addEventListener(eventType, (e) => { ... });

第三种解决方案(可能)是仅使用PointerEvents，但这取决于您需要支持的平台。 https://caniuse.com/#search=pointer%20events

如果您确定不能使用以下方法之一:每个事件都应该有一个时间戳属性(不确定它是否是这样命名的)，也许您可​​以找到一种方法来区分两个事件。