需要在播放视频前增加一个广告,实现代码如下:
<script>
window.onload=function(){
// 我这块是一个页面里多个video标签, 所以需要用id区分
$('.course_lists').each(function (n) {
var id = $(this).attr('id');
$(this).find('video').attr('id','video_'+id);
var i = id.split('_')[1];
guanggao(i)
})
}
// 贴片广告 2020-12-29 13:42:19 刘啸宇
var guanggao =function(id){
// 广告资源
var nextVideo ="/ceshi.mp4";
var videoPlayer = document.getElementById('video_lists_'+id);
var _cur_video_src = videoPlayer.src;
// 目的是为了后边 remove
var handle = function(videoPlayer, nextVideo){
videoPlayer.src = nextVideo;
// 自动播放视频时 需搭配 autoplay 和 muted
videoPlayer.autoplay = 'autoplay';
videoPlayer.muted = 'muted';
}
// 监听 play
videoPlayer.addEventListener('play',handle(videoPlayer, nextVideo),false)
// 监听视频播放完毕 ended
videoPlayer.addEventListener('ended',function (){
// 去掉 监听
videoPlayer.removeEventListener('play', handle, false)
videoPlayer.src = _cur_video_src;
// 跳转回之前观看的位置
var currenttime = $("#lists_"+id).attr('data-data');//获取每个课程的上次观看时长
$('#video_lists_'+id).on("loadedmetadata", function () {
videoPlayer.autoplay = false;
videoPlayer.muted = false;
videoPlayer.currentTime = currenttime;
// 禁止快进
var sym_i;
setInterval(function () {
var time=videoPlayer.currentTime
if(time-sym_i>1){
videoPlayer.currentTime=sym_i
}
sym_i=videoPlayer.currentTime
},500);
});
},true)
}
</script>