There are a few problems:
a) Your JavaScript runs before any of the elements has been loaded. Either put your script at the end of your
body
tag, or wrap it in the
window.onload
event like this:
window.onload = function(e) {
}
b) The variable
i
is undefined.
c) The
autoplay
doesn't do anything and can be removed; you have to play the first video using JavaScript.
var videoSource = new Array();
videoSource[0] = 'http://devdoodle.net/a/beep.mp3';
videoSource[1] = 'http://devdoodle.net/a/beep.mp3';
var i = 0;
var videoCount = videoSource.length;
function videoPlay(videoNum) {
document.getElementById("myVideo").setAttribute("src", videoSource[videoNum]);
document.getElementById("myVideo").load();
document.getElementById("myVideo").play();
}
document.getElementById('myVideo').addEventListener('ended', myHandler, false);
videoPlay(0);
function myHandler() {
i++;
if (i == (videoCount - 1)) {
i = 0;
videoPlay(i);
} else {
videoPlay(i);
}
}