Wie Video dynamisch spielen, wenn seine Quelle

Question

geändert Ich habe ein bekam

<input type="file" id="howtovideo" name="howtovideo" accept="video/mp4"> </span> 

Wenn seine geändert, ich die unten Funktion nenne

$("#howtovideo").on('change', function() { 
    loadVideo(); 
}); 

function loadVideo(){ 
    alert('loadVideo called'); 
    var newsrc = 'http://clips.vorwaerts-gmbh.de/VfE_html5.mp4'; 
    var video = document.getElementById('video'); 
    var source = document.createElement('source'); 
    source.setAttribute('src', newsrc); 
    video.appendChild(source); 
    video.play(); 
} 

Video dynamisch zu spielen, aber nichts geschieht und Es gibt keine Fehler in der Konsole demo. Könnten Sie bitte lassen Sie mich wissen, wie Vdeo dynamisch zu spielen ??

Answer 1

Sie müssen kein neues source Tag hinzufügen. Setzen Sie die Adresse des neuen Videos nur auf src Attribut des aktuellen Tags source. Beachten Sie, dass Sie nach dem Ändern von src Vidoe laden müssen, indem Sie .load() verwenden und dann Video abspielen. Wenn Sie jQuery verwenden, verwenden Sie es auch, um Elemente zu finden.

$("#howtovideo").on('change', function(){ 
    loadVideo(); 
}); 

function loadVideo(){ 
    var newsrc = 'http://clips.vorwaerts-gmbh.de/VfE_html5.mp4'; 
    $('#video > source').attr('src', newsrc); 
    $("#video")[0].load(); 
    $("#video")[0].play(); 
}