setAttribute y video.src para cambiar la fuente de la etiqueta de video no funciona en IE9

He leído literalmente cada hilo de stackoverflow sobre cambiar la fuente de la etiqueta de video de forma dinámica a través de Javascript en IE9, incluyendo las publicaciones útiles pero no acordadas here y here, pero siente que hay otra solución. Aquí está el ejemplo muy básico de lo que estoy tratando de hacer:setAttribute y video.src para cambiar la fuente de la etiqueta de video no funciona en IE9

var video = document.getElementById('video'); 
    //now, use either of the lines of code below to change source dynamically 

    video.src = "nameOfVideo"; 
    //or use... 
    video.setAttribute("src", "nameOfVideo");

Ambas líneas de código son odiados a fondo por Internet Explorer, en particular debido a que el src definitivamente está siendo changeed después de ser comprobado con un simple video.getAttribute, aunque IE no hace nada para cambiar el video.

Sí, hay IE que DEBE tener los src's listados con el HTML para cambiarlos después de que la página se haya cargado, PERO definitivamente he encontrado un hilo en stackoverflow que propuso una solución a través de JavaScript simple. (Para mi decepción, ya no puedo encontrar el hilo que lo hizo ... y he buscado en todas partes, créanme).

Dicho todo esto, si alguien puede proporcionar una solución SIN el uso de colocar todas las videograbaciones dentro del HTML y, en su lugar, establecer/crear dinámicamente el src usando JavaScript como se muestra arriba, le estaría sumamente agradecido.

(O bien, si pudiera indicarme el hilo de desbordamiento 'que falta' que prueba si el atributo existe en IE, y luego configurar de alguna manera el src mediante javascript, eso también será apreciado).

Fuente

2012-08-28 mkralla11

¡Buenas noticias, encontré una verdadera solución para cambiar/cambiar videos en etiquetas de video HTML5 a través de JavaScript sin usar el molesto truco que traté de explicar! Es increíblemente simple y me llevó MUCHO experimentar con IE. A continuación se muestra el código en su forma más simple para trabajar en IE:

<html> 
    <body> 
    <video id='videoPlayer' width="320" height="240" controls="controls"> 
     <source id='mp4Source' src="movie.mp4" type="video/mp4" /> 
     <source id='oggSource' src="movie.ogg" type="video/ogg" /> 
    </video> 

<!-- You MUST give your sources tags individual ID's for the solution to work. --> 

    <script> 
     var player = document.getElementById('videoPlayer'); 

     var mp4Vid = document.getElementById('mp4Source'); 

     player.pause(); 

     // Now simply set the 'src' property of the mp4Vid variable!!!! 

     mp4Vid.src = "/pathTo/newVideo.mp4"; 

     player.load(); 
     player.play(); 
    </script> 
    </body> 
</html>

Y ahí lo tienes. Increíblemente simple: probado y funcionando en IE8 e IE9 ... Si tiene algún problema, hágamelo saber.

Fuente

2012-09-16 15:11:18 mkralla11

Estoy en otra vuelta con vid html5. La compatibilidad del navegador es difícil aquí. El tiempo se estaba acumulando para que IE9 hiciera lo que ff y Chrome podían hacer. Tu publicación ha sido clave. Perfecto, gracias. Por cierto, buen sitio web :) –

Lo rompí. Tomó unos pocos minutos ansiosos, pero encontró el .. ORDEN O EL ELEMENTOS! .. es critico. .mp4 debe estar antes del tipo .ogg. Cambié para que no dijera "tipo no compatible" en la consola. ¡Pero ff funciona de cualquier manera pero los otros no! –

IE8? ¿Cómo es eso posible? Ie8 no es compatible con la etiqueta de video. – franzlorenzon

setAttribute y video.src para cambiar la fuente de la etiqueta de video no funciona en IE9

Respuesta

Cuestiones relacionadas