Perché creare un elemento video in modo dinamico utilizzando jQuery non funziona in IE9

sto cercando di ricreare il seguente con JqueryPerché creare un elemento video in modo dinamico utilizzando jQuery non funziona in IE9

<video width="640" height="264" autoplay> 
    <source src="http://video-js.zencoder.com/oceans-clip.mp4" type="video/mp4" /> 
    <source src="http://video-js.zencoder.com/oceans-clip.webm" type="video/webm" /> 
    <source src="http://video-js.zencoder.com/oceans-clip.ogv" type="video/ogg" /> 
</video>

http://jsfiddle.net/4bkpU/2/

Sono venuto con la seguente ma in IE9 l'elemento video è vuoto, qualcuno può dirmi perché e cosa avrei bisogno di cambiare per poter aggiungere dinamicamente i video in IE9? Funziona bene con Firefox, Chrome e Safari.

HTML

<div id="videoHolder"> 
</div>

JQuery

var video = $('<video width="640" height="264" autoplay></video>') 
      .append('<source src="http://video-js.zencoder.com/oceans-clip.mp4" type="video/mp4" />') 
      .append('<source src="http://video-js.zencoder.com/oceans-clip.webm" type="video/webm" />') 
      .append('<source src="http://video-js.zencoder.com/oceans-clip.ogv" type="video/ogg" />') 
      .appendTo($("#videoHolder"));

AGGIORNATO - ha chiuso il tag video qui sopra e addded nuovo link

http://jsfiddle.net/8Cevq/

fonte

2011-08-24 Tom

Provare con '$ ('')' (aggiungi '' tag di chiusura) – arnaud576875

provare la seguente, questo funziona:

$("#videoHolder").html(
    '<video width="640" height="264" autoplay>' + 
     '<source src="http://video-js.zencoder.com/oceans-clip.mp4" type="video/mp4"></source>' + 
     '<source src="http://video-js.zencoder.com/oceans-clip.webm" type="video/webm"></source>' + 
     '<source src="http://video-js.zencoder.com/oceans-clip.ogv" type="video/ogg"></source>' + 
    '</video>');

JSFIDDLE example.

Quello che ho fatto per ottenere questo lavoro è stato:

A) utilizzare il metodo html per iniettare il mark-up desiderato tutto in una volta
B) tag Altered (sia su video e source) a utilizzare i tag di chiusura completa al contrario di stenografia />

_{Un video piuttosto fresco, tra l'altro.}

fonte

2011-08-24 11:46:23

Brillante, grazie mille. Sembra strano che debba essere fatto in questo modo? – Tom

Nessun problema. Penso che in questo modo sia un po 'più chiaro, comunque; usando 'append' su un gruppo di stringhe quindi' appendTo' perché l'elemento significativo potrebbe apparire un po 'troppo elaborato a prima vista. –

@Tom: consulta http://stackoverflow.com/questions/7878367/video-tag-not-working-in-ie-9 per la spiegazione del motivo per cui devi inserire il tag video tutto in una volta utilizzando $ (elemento). html (VideoElement). In breve, c'è un bug in IE9 che non consente l'aggiunta di tag sorgente dopo che un tag video è stato aggiunto, devono essere aggiunti allo stesso tempo. – MontyThreeCard

IE9 non piace quando si aggiunge il contenuto dell'elemento <video> in modo dinamico, quindi è necessario aggiungere l'elemento <video> ed è contenuto tutto in una volta.

Nota: IE9 non sembra avere un problema con la stenografia <source ... /> finché non si tenta di aggiungerlo in seguito.

fonte

2012-03-16 20:01:15 thingEvery

Questo sembra molto simile a quello che mi sta succedendo in questo momento. C'è qualche dettaglio in più su ciò che non piace? – SpaceBeers

Perché creare un elemento video in modo dinamico utilizzando jQuery non funziona in IE9

risposta

Problemi correlati