如何在此播放/暂停按钮上添加重播功能

Question

我希望播放/暂停按钮在视频剪辑的末尾显示“ replay ”。 用我已经拥有的功能做到这一点的最佳方法是什么。

// Event listener for the play/pause button
playButton.addEventListener("click", function() {
    if (video.paused == true) {
        // Play the video
        video.play();

        // Update the button text to 'Pause'
        playButton.innerHTML = "Pause";
    } else {
        // Pause the video
        video.pause();

        // Update the button text to 'Play'
        playButton.innerHTML = "Play";
    }
});

Answer 1

video.addEventListener("ended", function(){
  playButton.textContent = "replay";
});

Answer 2

看来您必须看一下这篇文章

您可以只听视频元素上的结束事件：

video.addEventListener('ended', function(e) {
playButton.innerHTML = "<img src='http://www.iconninja.com/files/838/134/365/replay-icon.png'/>";
    })

Answer 3

将其添加到您的代码中，每隔一秒钟检查一次，看媒体是否已完成播放

   <video id='mediaObj'>.... </video>
       <script>
                    setInterval(function (){
            var aud = $('#mediaObj'); //get the html5 media object
                    curTime = parseInt(aud.currentTime);  //get it current time
                durTime = parseInt(aud.duration); //check it total play time/duration

     if (curTime == durTime) playButton.innerHTML = "<img src='http://www.iconninja.com/files/838/134/365/replay-icon.png'/>"; // code to show replay button goes here




                },1000);
         </script>