1
<!doctype html>
<html>
<head>
    <title>Sequential Movies</title>
    <script type="text/javascript">
        // listener function changes src
        function myNewSrc() {
            var myVideo = document.getElementsByTagName('video')[0];
            myVideo.src = "2.m4v";
            myVideo.load();
            myVideo.play();
        myVideo.addEventListener('ended', myAddListener, false);
        }
        // add a listener function to the ended event

        function myAddListener(){
            var myVideo = document.getElementsByTagName('video')[0];
        myVideo.src = "1.m4v";
            myVideo.load();
            myVideo.play();
            myVideo.addEventListener('ended', myNewSrc, false);
        }
    </script>
</head>
<body onload="myAddListener()">
    <video controls
           src="1.m4v">
    </video>
</body>
</html>

看来问题是video1可以切换到video2,但video2不能切换回video1。如何编写脚本来循环 1 > 2 > 1 > 2 > 1 > 2 > 1?是否可以切换三个以上的视频源?我不知道底部链接在说什么,但它似乎对我有用。

在“结束”时播放数组中的下一个视频

4

2 回答 2

0

实际上,您将两个侦听器添加到同一个视频对象。你可以使用这样的东西:

<!doctype html>
<html>
<head>
    <title>Sequential Movies</title>
    <script type="text/javascript">
        var videoSources = ["SSR-Styles.mp4","Gauges-radial.mp4"]
        var currentIndex = 0;

        function setFirstVideo()
    {
        var myVideo = document.getElementsByTagName('video')[0];
            myVideo.src = videoSources[currentIndex];
    }

    function videoEnded(){
            var myVideo = document.getElementsByTagName('video')[0];
            currentIndex = (currentIndex+1) % videoSources.length;
            myVideo.src = videoSources[currentIndex];
            myVideo.load();
            myVideo.play();
        }    
</script>
</head>
<body onload="setFirstVideo()">
    <video controls  onended="videoEnded()"
           src="">
    </video>
</body>
</html>
于 2012-12-04T09:17:04.140 回答
0

这将自动循环播放 2 个视频:

var id = 1; // Current video number
var myVideo = document.getElementsByTagName('video')[0];
myVideo.addEventListener("ended", myNewSrc)

function myNewSrc() {
    myVideo.src = id+".m4v";
    myVideo.load();
    myVideo.play();
    id++ % 2 + 1; // Set ID to the other number
}

在您的 html 中:

<body onload="myNewSrc()">
于 2012-12-04T09:20:54.680 回答