如何將文件路徑動態加載到html5源代碼中？

我想使用jQuery將視頻文件源的路徑加載到html5視頻元素的源代碼中。視頻標籤位於Bootstrap模式中，在模式打開之前不會加載。設置是這樣的：如何將文件路徑動態加載到html5源代碼中？

<video class="video-element" controls> 
    <source class="mp4" src="" type="video/mp4"> 
    <source class="webm" src="" type="video/webm"> 
    <source class="ogg" src="" type="video/ogg"> 
    Your browser doesn't support HTML5 video tag. 
</video>

這裏的實際問題：我能到源路徑添加到src屬性在所有三個源標籤。但是，視頻不會顯示。

這是我測試和嘗試的。

我已刪除了3個<source>標籤和添加的源路徑直接向<video>標籤的src屬性。做到這一點，一切正常。該視頻出現並可播放。我使用jQuery動態地做了這件事，就像我正在試圖用3 <source>標籤一樣。
我已經在html中靜態添加了3 <source>標記的src屬性的源路徑，而不是通過jquery動態添加。這也很好，視頻播放。
我已驗證路徑是否正確，當我將其動態添加到3 <source>標記的src屬性時。

所以，出於某種原因，當我直接並加載路徑進入<video>標籤的src屬性的視頻播放，當我把它靜態到3 <source>標籤，但不是當的HTML SRC屬性我使用jQuery將其加載到<source>標籤中。

任何接受者？

來源

2017-03-03 Guybrush Threepwood

我可能會簡化事情，只有通過檢查canPlayType與單個src工作，然後就加載相關的源

<video class="video-element" id="video" controls> 
    Your browser doesn't support HTML5 video tag. 
</video> 

<script> 
var v = document.getElementById("video") 
var vid = "video-file-name" // assumes all videos have the same file prefix, just different extensions 
if (v.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"') == "probably") { 
    vid = vid + ".mp4" 
} else if (v.canPlayType('video/webm; codecs="vp8.0, vorbis"') == "probably") { 
    vid = vid + ".webm" 
} else { 
    vid = vid + ".ogg" 
} 
v.src = vid 
</script>

來源

2017-03-04 16:30:18 Offbeatmammal

如何將文件路徑動態加載到html5源代碼中？

回答

相關問題