Question

感谢您的光临。我正在创建一个循环浏览视频剪辑的页面。循环通过part（run（）函数）工作得很好。我还创建了几个按钮来播放特定的视频剪辑，但这些按钮无效。我只写了第一个按钮的功能，当我第一次按下时，我会写另外两个。

任何帮助，如果非常感谢。

谢谢，托米

<video id="tutorials" autoplay onended="run()" 
    autobuffer="true" width="600px" height="350px" controls>
<source src="video1.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
</video>

<br>
<br>

<button id="tut1">Play Tutorial 1</button>
<button id="tut2">Play Tutorial 2</button>
<button id="tut3">Play Tutorial 3</button>

<script type="text/javascript">

    video_count =1;
    videoPlayer = document.getElementById("tutorials");

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

    document.getElementByID("tut1").onclick = function()
    {
        videoPlayer.stop();
        videocount = 1;
        var video = "video1.mp4";
        videoPlayer.src = video;
        videoPlayer.play();
    }

</script>

Answer 1

我更喜欢用这种方式构建代码：

<script type="text/javascript">

  video_count =1;
  videoPlayer = document.getElementById("tutorials");

  function runNext()
  {
    runVideo(video_count+1);
  }

  function runVideo(number)
  {
    if (number > 3) return;
    video_count = number;
    videoPlayer.src = "video"+video_count+".mp4";
    videoPlayer.play();
  }

</script>

HTML：

<button id="tut1" onclick="runVideo(1);">Play Tutorial 1</button>
<button id="tut2" onclick="runVideo(2);">Play Tutorial 2</button>
<button id="tut3" onclick="runVideo(3);">Play Tutorial 3</button>

Javascript＆amp; HTML5 - 播放下一个视频不起作用的按钮

1 个答案: