Javascript onended определяет конец видео

Question

Все в моем коде работает. Он просто не переключается на следующую песню / видео после окончания текущей. Я пытался добавить onended обработчик события (в теге и в JavaScript), но не удалось. Я также попробовал jQuery, но это не сработало. По некоторым причинам это не меняет песни в конце песни. Вместо этого он будет воспроизводить одну и ту же песню снова и снова.

<video id="vid" src="main/" playsinline autoplay loop>
  <script>
   var video = document.currentScript.parentElement;
   video.volume = 0.1;  
   var lastSong = null;
   var selection = null;
   var playlist = ["main/songn.mp4", "main/songl.mp4", "/main/songt.mp4", "/main/songf.mp4"]; // List of Songs
   var video = document.getElementById("vid"); 
   video.autoplay=true;
   video.addEventListener("ended", selectRandom); 

   function selectRandom(){
    while(selection == lastSong){ 
     selection = Math.floor(Math.random() * playlist.length);
    }
    lastSong = selection; 
    video.src = playlist[selection]; 

   }

   selectRandom(); 
   video.play();

  </script>
</video>

Answer 1

Вам просто нужно удалить loop параметр из тега video, если вы хотите вызвать конечное событие ( doc):

<video id="vid" src="main/" playsinline autoplay>

(Ваш код будет обрабатывать цикл, загружая новую песню после ее завершения.)

Кстати, держать var video = document.getElementById("vid"); ссылаться на ваш <video> тег, он короче и чище, чем первое объявление.