播放完后如何播放第二个.mp4视频？

Question

I am currently working on a project where it plays a .mp4 file, and after the .mp4 file has ended, it will select another .mp4 file to play. 我目前正在研究一个播放.mp4文件的项目，.mp4文件结束后，它将选择另一个.mp4文件进行播放。

I'm trying to copy the mechanics of a television. 我正在尝试复制电视机的结构。 It plays an episode of a show, then plays another episode. 它先播放一集节目，然后再播放另一集。

After the .mp4 file ends, I would like for it to autoplay another .mp4 file. .mp4文件结束后，我希望它自动播放另一个.mp4文件。

This is the code I have so far: 这是我到目前为止的代码：

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>HTML Television</title>
    <style>
        * {
            margin: 0; /* fallback style */
            margin: initial;
        }
        html {
            background-color: black;
            color: white;
        }
        video {
            display: block;
            margin: 0 auto;
            max-height: 200vh;
            max-width: 400vw;
        }

    </style>
</head>
<body>
    <section id="videos">

        <video poster="video3.png" controls="controls" preload="none">
            <source type="video/mp4" src="../TV/TV/1.mp4">
        </video>
        <video poster="" controls="controls" preload="none">
        <source type="videp/mp4" src="../TV/Commercial/1.mp4">
    </section>
    <script>
        (function () {
            "use strict";
            var videosSection = document.getElementById("videos");
            var videosSectionClone = videosSection.cloneNode();
            var videos = videosSection.getElementsByTagName("video");
            var randomVideo = videos.item(Math.floor(Math.random() * videos.length)).cloneNode(true);
            randomVideo.removeAttribute("controls");
            randomVideo.setAttribute("preload", "auto");
            videosSectionClone.appendChild(randomVideo);
            videosSection.parentNode.replaceChild(videosSectionClone, videosSection);
            randomVideo.play();
        })();
    </script>
</body>

How can I do this? 我怎样才能做到这一点？

Answer 1

Try Html5 video onended event. 尝试Html5视频事件。

Html: HTML：

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

jQuery: jQuery的：

var video_count =1;
var videoPlayer = document.getElementById("episodeVideo");

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

check details of Event http://www.w3schools.com/tags/ref_eventattributes.asp 查看活动http://www.w3schools.com/tags/ref_eventattributes.asp的详细信息

播放完后如何播放第二个.mp4视频？

问题描述

1 个解决方案

解决方案1
1 已采纳 2016-07-24 15:08:56

播放完后如何播放第二个.mp4视频？

问题描述

1 个解决方案

解决方案1 1 已采纳 2016-07-24 15:08:56

解决方案1
1 已采纳 2016-07-24 15:08:56