javascript - 如何停止事件监听器，它在杀死它后甚至继续触发？

Question

我有以下方法，该方法执行视频剪辑，并在视频剪辑的进度上发出一个警报，在该警报之后，它应该关闭监听器，但它并没有结束事件监听器，因此警报永远显示就像无限一样。

这是一个BUG吗？或者我的以下代码中缺少某些内容？

function video_present(input) {

  $('#mediaplayer').prop('loop', false); 
  $('#mediaplayer').attr('src', filename).show();
  mediaplay_video= document.getElementById('mediaplayer');  
  mediaplay_video.play();      
  
  // STOP repeating??
  mediaplay_video.addEventListener('timeupdate', function() {
    var sss = parseInt(mediaplay_video.currentTime % 60);
    show_second();
  }, false);  
  
}

// kill Event after 1 time execute of this
function show_second() {
  alert('I was executed - stop me now if you can??');
  mediaplay_video.removeEventListener('timeupdate', function() {
    alert('I am killed, but why am i again getting called???');
  });


}

video_present('Terminator_10.webm');

Answer 1

removeEventListener 的第二个参数是监听器函数本身。如果您不传递与 addEventListener 相同的参数，则不会将其删除。使用命名函数或函数变量来确保在两个地方使用相同的函数对象:

function handleTimeUpdate() {
  var sss = parseInt(mediaplay_video.currentTime % 60);
  show_second(); 
}

mediaplay_video.addEventListener('timeupdate', handleTimeUpdate, false);  

...

mediaplay_video.removeEventListener('timeupdate', handleTimeUpdate);