Различают события JavaScript - PullRequest
Новая
       20

Различают события JavaScript

0 голосов
/ 12 ноября 2018

Как лучше всего различать события в JavaScript.

На самом деле меня интересуют два момента. Первый: есть ли что-то вроде id в событии (это было бы очень полезно для отладки в целях).И еще один момент: есть лучшие способы различить события mousedown и mousedown & touchstart.

Позвольте мне рассказать вам мою историю.Я столкнулся с проблемой, что если вы добавляете два события dom к узлу с триггерами mousedown и touchstart, то на мобильных устройствах запускаются и mousedown, и touchstart.

Первое найденное мной решение былозапускать 

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

в начале каждой функции слушателя.

Но затем я обнаружил шаблон делегирования события и начал работать с аналитикой, все, что не позволяло использовать предыдущий подход,поэтому я придумываю следующее решение: 

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)?

Спасибо.

1 Ответ

0 голосов
/ 12 ноября 2018

Вместо того, чтобы пытаться различать события, просто подпишитесь только на mousedown, так как он все равно запускается. Это самое простое решение, которое я бы сказал.

Или вы можете попытаться определить, какая система событий поддерживается, и подписаться только на соответствующую: 

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

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

Третье решение (возможно) будет использовать только PointerEvents, но это зависит от платформ, которые вам нужно поддерживать. https://caniuse.com/#search=pointer%20events

Если вы точно не можете использовать один из этих подходов: каждое событие должно иметь свойство временной метки (не уверен, если оно названо таким образом), возможно, вы сможете найти способ различать два события с ним.

...