Кнопка, чтобы пропустить HTML5 видео до конца - PullRequest
Новая
       1

Кнопка, чтобы пропустить HTML5 видео до конца

0 голосов
/ 23 марта 2019

У меня есть видеоплеер, в котором есть кнопка пропуска, чтобы пользователь мог пропустить видео до конца.

Вот 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, он не работает,

что мне нужно изменить, чтобы получить то, что я хочу?

1 Ответ

2 голосов
/ 23 марта 2019

Полагаю, вам не нужно снова вызывать функцию 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>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...