video.js 只能后退不能快进
项目需要做一个视频教学 要求只能后退不能快进 找了很久才找到方法
话不多说 直接 上代码。
js代码
//用户可观看的最大值
var watchMaxTime = 0;
// 视频播放
var player = videojs('my-video',{
//预加载
preload : "auto",
// 自动播放 默认值false
//autoplay : false,
//控制栏
controls : true
},function onPlayerReady(){
//这里绑定事件
var myPlayer = this;
//绑定 播放时间改变事件
myPlayer .on('timeupdate', function () {
// 此处正常播放时 获取的视频进度
var time = myPlayer.currentTime();
if (time > watchMaxTime) {
watchMaxTime = time;
}
});
}
});
//只能快进不能后退
videojs.use('*', function(player){
return {
// time 应该为 点击或拖动视频的值
setCurrentTime: function(time) {
//快进 值比最大观看点的大 则跳转至最大观看点
if (time > watchMaxTime) {
return watchMaxTime;
} else {
//值比最大观看点的小 则允许跳转
return time;
}
}
};
});
html代码
<div >
<video id="my-video" class="video-js vjs-big-play-centered vjs-remaining-time "
style="width: 100%;height: 100%" autoDisable="true" poster="" >
<!-- 设置自己视频的路径 -->
<source src="testVideo/test.mp4" type="video/mp4">
</video>
</div>
这样就ok了, 具体是通过下面的连接 找到的方法。