addEventListener '再生'は1回だけ発生します。

Question

私は、特定のページ上のすべてのvideoの要素を取得し、それらにplayingイベントが適用され、次のscriptがあります

var video = document.getElementsByTagName("video"); 

for(var i = 0; i < video.length; i++){ 
(function(vid) { 
    vid.addEventListener('playing', function(){ 
     var percentComplete = Math.round((vid.currentTime/vid.duration) * 100); 
     console.log(percentComplete); 
    }); 
}) 
(video[i]); 
} 

私はページを実行し、例えば、ビデオ1をクリックしたときに今、私はpercentCompleteビーイングを見ますconsole logにログオンしましたが、ビデオ1が終了してビデオ2をクリックすると、consoleに何も書き込まれませんでした。このaddEventListenerは、クリックされた最初のビデオにのみ適用されます。なぜか、ビデオが再生されるたびに？

Answer 1

外部クロージャを削除し、リスナ内でevent.targetを使用してみます。

var video = document.getElementsByTagName("video"); 

for (var i = 0; i < video.length; i++) { 
    video[i].addEventListener('playing', function (event) { 
     var vid = event.target 
     var progress = Math.round((vid.currentTime/vid.duration) * 100) 
     console.log(progress) 
    }) 
} 

興味のある人は、the full list of media eventsです。