установить тайм-аут для функции прослушивателя событий


У меня есть слушатель событий

elem.addEventListener('evt', fooFn(){alert("OK")});

Я хотел бы иметь тайм-аут для этого слушателя событий. Итак, предположим, что если он не получает никакого события под названием " evt " в течение 3 секунд, я хотел бы иметь уведомление о том, что он тайм-аут.

Я пытался использовать функцию setTimeout, но пока мне не удается передать внутреннюю переменную функции обратного вызова addEventListener (fooFn) в функцию setTimeout.

Есть идеи, как я мог бы сделать это?

3 2

3 ответа:

var evtFired = false;
setTimeout(function() {
    if (!evtFired) {
      // show notification that evt has not been fired
    }
}, 3000);

function fooFn() {
    evtFired = true;
    alert('OK');
}

elem.addEventListener('evt', fooFn);

Может быть, это сработает, просто поместите "внутреннюю переменную" во внешнюю область

Я думаю, что это должно сработать.

 function addTimeoutEvent(elem){
   var timeout = setTimeout(function(){
      alert('the time is out');
      elem.removeEventListener('evt',foo)
   },3000);
   elem.addEventListener('evt', foo);
   function foo (){
     if(timeout)
       clearTimeout(timeout);
     alert("OK")
   }
 }

Попробуйте следующее решение:

let btn = document.getElementById('btn');

let timeOut = setTimeout(() => {
  btn.removeEventListener('click', handler);
  alert('no event on btn');
}, 3000);

let handler = x => {
  clearTimeout(timeOut);
  alert('click on btn')
};

btn.addEventListener('click', handler);
<button id="btn">click me within 3 sec</button>