Как вызвать / обработать разные обработчики событий для одного и того же события на одном элементе?JavaScript

Question

Мне любопытно, я знаю, что можно подключить несколько обработчиков событий к одному элементу, если я использую метод DOM Level 2 с именем addEventListener (), поэтому мне интересно, есть ли у нас такая ситуация:

someButton.addEventListener("mouseover", showHint, false);

someButton.addEventListener("mouseover", showHintTwo, false);

Возможно ли это в сценарии реального мира?Пример выше ^

И как я могу выбрать, когда я хочу позвонить showHint и когда я хочу позвонить showHintTwo, возможно ли обработать это / отделить это как-то ... потому что оба событияобработчики сработают, когда mouseover произошло?

Спасибо, ребята

Приветствия

Answer 1

Как это?https://codepen.io/cyruscuenca/pen/xmrxob

Это не имеет особого смысла, но удовлетворяет то, что вы хотите.

• 2 обработчиков событий.
• Вы можете выбрать, какой блок на самом деле отображается с помощью переключателя.

Я бы лично добавил один обработчик событий и передатьв состоянии как:

document.getElementById("btn").addEventListener("click", function(condition) {
    switch(condition) {
      case x:
      // code block
      break;
    case y:
      // code block
      break;
    default:
      // code block
  } 
});

Answer 2

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

let hintCounter = 1;

function showHint() {
    switch(hintCounter) {
        case 1: // show first hint
        case 2: // show second hint
    }

    hintCounter++;
}

someButton.addEventListener("mouseover", showHint, false);

Если вам нужно настроить отображение второй подсказки через определенное время, посмотрите на setTimeout()функция в JS.