從數組中加載HTML5視頻播放器

我有一系列視頻，我想將它們加載到當前在頁面上的設置視頻播放器中。下面是我有：從數組中加載HTML5視頻播放器

var current = 0; 

var videos = ["01", "02", "03", "04"]; 

function shuffle(array) { 
    var currentIndex = array.length, temporaryValue, randomIndex ; 

    // While there remain elements to shuffle... 
    while (0 !== currentIndex) { 

    // Pick a remaining element... 
    randomIndex = Math.floor(Math.random() * currentIndex); 
    currentIndex -= 1; 

    // And swap it with the current element. 
    temporaryValue = array[currentIndex]; 
    array[currentIndex] = array[randomIndex]; 
    array[randomIndex] = temporaryValue; 
    } 

    return array; 

} 

function shuffleAll(){ 
    shuffle(videos); 
} 

function loadVideo(){ 
    var video = document.getElementById('video'); 
    var mp4 = document.getElementById('mp4'); 
    d = new Date(); 

    mp4.src = "videos/" + videos[current] + '.mp4'; 
    alert(mp4.src); 
    video.load(); 
    video.play(); 

}

而我的HTML：

<body onLoad="shuffleAll()"> 

<a href="" onClick="javascript:loadVideo();">Load Video</a><br> 
<video id="video" controls width="560"> 
    <source id="mp4" type="video/mp4" /> 
</video> 
</body>

但我點擊我的加載視頻按鈕，它不會做任何事情。我錯過了什麼？

來源

2014-09-23 Murphy1976

您需要暫停視頻，然後加載視頻然後播放。這真是一個棘手的兒子。您需要將聽衆添加到視頻通話記錄（通過隨機化或其他方式更改來源）

videobutton.addEventListener("click", function(event) { 
    video.pause(); 
    mp4.setAttribute('src', 'videos/' + videos[current] + '.mp4'); 
    video.load(); 
    video.play(); 
},false);

這會起作用。

var current = 0; 

var videos = ["01", "02", "03", "04"]; 

function shuffle(array) { 
var currentIndex = array.length, temporaryValue, randomIndex ; 
// While there remain elements to shuffle... 
while (0 !== currentIndex) { 
// Pick a remaining element... 
randomIndex = Math.floor(Math.random() * currentIndex); 
currentIndex -= 1; 
// And swap it with the current element. 
temporaryValue = array[currentIndex]; 
array[currentIndex] = array[randomIndex]; 
array[randomIndex] = temporaryValue; 
} 

return array; 

} 

function shuffleAll(){ 
    shuffle(videos); 
} 

function loadVideo(){ 
    var video = document.getElementById('video'); 
    var mp4 = document.getElementById('mp4'); 
    d = new Date(); 
    video.pause(); 
    mp4.setAttribute('src', 'videos/' + videos[current] + '.mp4'); 
    video.load(); 
    video.play(); 
}

來源

2014-09-23 18:04:53 EasyBB

是videobutton的一個類還是一個ID？沒關係...我是個白癡...... – Murphy1976 2014-09-23 18:07:36

不，它是一個緩存對象。所以說你的按鈕是'

'，所以我們的視頻應該是'var videobutton = document.getElementById（'next'）; 我會修復它與您的工作 – EasyBB 2014-09-23 18:29:58

我將需要jQuery爲此，呵呵。 – Murphy1976 2014-09-23 18:45:55

從數組中加載HTML5視頻播放器

回答

相關問題