Question

我有一个事件监听器

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

我希望此事件侦听器超时。所以，假设如果它在3秒内没有收到任何名为'evt'的事件，我想通知它超时。

我尝试使用setTimeout函数，但到目前为止，我无法将addEventListener回调函数（fooFn）的内部变量传递给setTimeout

关于如何制作它的任何想法？

Answer 1

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

也许这会起作用，只需将“内部变量”放在外部范围

中

Answer 2

我认为这应该有用。

 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")
   }
 }

Answer 3

尝试以下解决方案：

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>

Answer 4

试试这样（在我看来这是处理器和内存消耗最少的方法）：

const Permissions = process.env.isLocal ? 
     require('../models/localLogin/localPermissions') : 
     require('../models/permissions');

将超时设置为事件侦听器功能

4 个答案: