在做播放歷史視訊的時候，有連續播放視訊的需求，分享一下實現方法。

html程式碼：

<div class="video">

    <div class="container">

        <div class="video-details row">

            <h4 class="text-left color-white">初始視屏名</h4>

            <video src="初始視屏地址" poster="" autoplay="true" controls="true" volume="true" class="width-full" id="video-details"></video>

            <div class="back-index text-center"></div>

        </div>

    </div>

</div>
 

JS程式碼：

<script type="text/javascript">

$(window).load(function(){

 	var vList = [‘video1’,’video2’,’video3’]; // 播放列表

        var vLen = vList.length;  

        var curr = 0;  

        var myvideo = document.getElementById("video-details");  

        myvideo.onended = function() {

            myvideo.src = vList[curr];    

 	    var $text =  vList[curr];  

            myvideo.load();    

            myvideo.play();   

            curr++;   

            if(curr >= vLen){   

                curr = 0; //重新迴圈播放

            }

            $(".video-details h4").text($text);

        };

    })   
        
</script>