Diga si el vídeo se carga o no en Javascript

Question

Por lo tanto, he estado utilizando un oyente en

document.getElementById("video").buffered.length 

para ver si es mayor que para cuando 0 de un vídeo cargado o no. Esto funciona para un video muy pequeño, y solo en Google Chrome. No funciona en Firefox en absoluto. ¿Alguna idea de cómo hacer que esto funcione?

Básicamente, quiero esperar a que se carguen 3 videos separados para realizar una acción específica, ¿cómo hago esto?

Answer 1

Prueba esto:

var video = document.getElementById("video-id-name"); 

if (video.readyState === 4) { 
    // it's loaded 
} 

Lea aquí: https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/readyState

Answer 2

convertir esto en un oyente, en circunstancias normales, tendrá que escuchar a suspender el evento. Se activa cuando la descarga se detiene o se detiene por algún motivo, incluido el finalizado.

También querrá escuchar a jugar para los casos en los que el contenido ya está cargado (como, desde la memoria caché)

video.addEventListener("playing", function() { 
    console.log("[Playing] loading of video"); 
    if (video.readyState == 4) { 
     console.log("[Finished] loading of video"); 
    } 
}); 
video.addEventListener("suspend", function(e) { 
    console.log("[Suspended] loading of video"); 
    if (video.readyState == 4) { 
     console.log("[Finished] loading of video"); 
    } 
}); 

Fuente: https://developer.mozilla.org/en/docs/Web/Guide/Events/Media_events

Answer 3

Encuentro utilizando setInterval funciona para escuchar activamente a cuando el readyState de los cambios de vídeo mediante la comprobación de cada medio segundo hasta que se carga en.

checkforVideo(); 

function checkforVideo() { 
    var b = setInterval(()=>{ 
     if(VideoElement.readyState >= 3){ 

      \\do whatever you want done here 

      \\you can now clearInterval (stop checking every half second) 
      clearInterval(b); 
     }     
    },500); 
} 

Si no está USI ng ES6 simplemente reemplace () => con function()