Javascript增加2個視頻來源

嗨，我很新的JavaScript。我有一個.webm和.mp4視頻源，但是如何在javascript中添加另一個源代碼，我只能設置1（webm），我需要添加另一個代碼的代碼是什麼？Javascript增加2個視頻來源

謝謝您提前。

嗨，我之所以需要把JS是因爲DivX的插件更換HTML5視頻元素，如在此線程Prevent divx web plugin fron replacing html5 video element?

這裏是我的代碼

<script type="text/javascript"> 
function changevid() { 
    document.getElementById('vid').innerHTML = '<source src="http://avalonplay.com/video/loginvideo.webm" type="video/webm" />'; 
    document.getElementById('vid').load(); 
} 
</script> 

<body onload="changevid()"> 

    <video id="vid" width="800" height="450" loop="loop" preload="auto" autoplay style="width: 100%; height: auto; margin:0; right: 0;">  
    </video> 

</body>

來源

2013-02-23 AngelaK

我建議你只添加你需要的。

例如：

function changevid() { 
    var vid = document.getElementById('vid'); 

    if (vid.canPlayType('video/mp4') != '') { 
     vid.src = 'http://avalonplay.com/video/loginvideo.mp4'; 
    } 
    else if (vid.canPlayType('video/webm') != '') { 
     vid.src = 'http://avalonplay.com/video/loginvideo.webm'; 
    } 
    vid.load(); 
}

來源

2013-02-23 15:47:15

你可以使用.appendChild()而不是.innerHTML

但是一個更好的解決辦法是，以測試瀏覽器的支持，然後只添加支持的視頻類型：

window.onload = function(){ 

    var vid = document.getElementById('vid'); 
    var source = document.createElement('source'); 
    var supported = supportedVidType(); 

    source.src = 'http://avalonplay.com/video/loginvideo'+supported.src 
    source.type = supported.type 

    vid.appendChild(source); 

} 

var supportedVidType = function(){ 
    var vidTest = document.createElement("video") 

    var types = {} 

    if (vidTest.canPlayType) { 
     // Check for MPEG-4 support 
     types.mp4 = "" !== vidTest.canPlayType('video/mp4; codecs="mp4v.20.8"') 

     // Check for Webm support 
     types.webm = "" !== vidTest.canPlayType('video/webm; codecs="vp8, vorbis"'); 

     // Check for Ogg support 
     types.ogg = "" !== vidTest.canPlayType('video/ogg; codecs="theora"'); 
    } 

    for(type in types){ 
     if(types[type]) { 
      return { 
       type: 'video/'+type, 
       src: '.'+type 
      } 
     } 
    } 
}

這裏是一個的jsfiddle：http://jsfiddle.net/2gd3m/2/

來源

2013-02-23 15:36:13

視頻標籤支持多個來源：

<video width="320" height="240" controls> 
    <source src="movie.mp4" type="video/mp4"> 
    <source src="movie.ogg" type="video/ogg"> 
    Your browser does not support the video tag. 
</video>

從

：http://www.w3schools.com/tags/tag_video.asp

來源

2013-02-23 15:38:51 cIph3r

嗨，我之所以需要把JS是因爲DivX的插件正在取代HTML5視頻元素，如在此線程 http://stackoverflow.com/questions/4745626/prevent-divx-web-plugin-fron-replacement-html5-video-element – AngelaK 2013-02-24 00:23:07

mhhhhh ..這是因爲你的寬容程序員，divx人贏了.. !!!! 恥辱你!!!!!!! – cIph3r 2013-02-24 01:27:27

Javascript增加2個視頻來源

回答

相關問題