Question

我有一个视频播放器，其中包含一个跳过按钮，以便用户可以将视频跳过到最后。

这是html

<video id="video1" style="height: 100%" class="video-js vjs-default-skin" controls muted autoplay="true">
            </video>

跳过功能

function skipVideoTime(){
    $('.skip_button').on('click', function () {
        var vid = $("#video1")[0];
        var vidDuration = Math.floor(vid.duration);
        skipTime(vidDuration);
        console.log(vidDuration);

    })

}

function skipTime(time) {
    var vid = $("#video1")[0];
    vid.play();
    vid.pause();
    vid.currentTime = time;
    vid.play();
    console.log(vid.duration);
};

$(function () {

     skipVideoTime();


});

以下是上述功能的控制台日志

32.534

32

现在，当我单击按钮时，它会跳到32分钟，因为如果删除数学下限后我使用了数学下限功能，因此可以跳到32.534，则它不起作用，

要获得我想要的东西我需要改变什么？

Answer 1

我相信您不需要再次调用play()函数。因为一旦将媒体搜索到末尾（直到其总时长），调用play()便无能为力，只能从头开始播放视频。看看下面的代码片段。

var video = document.getElementById("myvid");
var button = document.getElementById("button");

button.addEventListener("click", function(e) {
	console.log(video.duration);
	video.play();
	video.pause();
	video.currentTime = video.duration;
// 	video.play();
})

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
</head>
<body>

	<video src="http://clips.vorwaerts-gmbh.de/VfE_html5.mp4" controls id="myvid"></video>
	<button id="button">skip</button>
</body>
</html>

用于将html5视频跳到最后的按钮

1 个答案: