HTML5 video loop src change on end play function not working

前端 未结 1 581
抹茶落季
抹茶落季 2020-12-06 21:00

I have a number of videos playing one by one in the same HTML5 video player

HTML

相关标签:
1条回答
  • 2020-12-06 21:30

    The html5 video element has an own eventtype onended, you dont need your own eventlistener.

    Html:

    <video id="homevideo" width="100%" autoplay onended="run()">
        <source src="app/video1.mp4" type='video/mp4'/>
    </video>
    

    and

    Script:

    video_count =1;
    videoPlayer = document.getElementById("homevideo");
    
    function run(){
            video_count++;
            if (video_count == 4) video_count = 1;
            var nextVideo = "app/video"+video_count+".mp4";
            videoPlayer.src = nextVideo;
            videoPlayer.play();
       };
    

    PS: Keep in mind that providing only one format for your video is not enough since no single format is supported by all major browsers yet.

    EDIT:

    LINK
    Source: w3schools

    At Media Events
    Events triggered by medias like videos, images and audio (applies to all HTML elements, but is most common in media elements, like <audio>, <embed>, <img>, <object>, and <video>):

    onended: Script to be run when the media has reach the end (a useful event for messages like "thanks for listening")

    0 讨论(0)
提交回复
热议问题