播放几秒钟的视频点击

Question

有没有办法只播放html视频几秒钟？

目前，当用户点击表格行时，视频会寻找预定义的时间（下面突出显示）。因此，在下面的示例中，视频将寻求7秒。

有没有办法从几秒钟开始播放视频只需10秒钟？即寻找00:07并播放到00:17并停止？

由于

Answer 1

您可以使用 timeupdate 事件以及currentTime属性

function playVideo() {
    var starttime = 7;  // start at 7 seconds
    var endtime = 17;    // stop at 17 seconds

    var video = document.getElementById('yourVideoId');

    video.addEventListener("timeupdate", function() {
       if (this.currentTime >= endtime) {
            this.pause();
        }
    }, false);

    //suppose that video src has been already set properly
    video.load();
    video.play();    //must call this otherwise can't seek on some browsers, e.g. Firefox 4
    try {
        video.currentTime = starttime;
    } catch (ex) {
        //handle exceptions here
    }
}

Answer 2

你可以创建一个计时器，所以在你＆＃34;寻找＆＃34;视频，它将在10秒内停止视频。 所以你在里面寻找你想要的功能。

var Video = $('Video Element')[0];
// After getting the video element play it.
Video.play(); 
// Now create a timer so in 10 second (1s = 1000 so 10s = 10000 ms) it will pause the video.
setTimeout(function(){
    Video.pause(); 
},10000);

Answer 3

我做了一个小脚本，可能对此有所帮助。 https://github.com/demux/jquery-video-cuepoints

用法：

$(document).ready(function() {
    var $v = $('#video');
    $v.cuepoints({
        17: function() {
            $v[0].stop();
        }
    });

    $('button').click(function(){
        $v[0].play();
        try {$v[0].currentTime = 7;} catch(e) {}
    });
});