H5 video 标签 播放事件

html 代码

<video controls="controls" id="video" poster="放图片，为了防止视频没加载完成显示空白" autoplay="autoplay自动播放"> <source src="视频路径" type="video/mp4" id="source"/> Your browser does not support the video tag. </video>

JS代码

var playimg=document.getElementById("playimg");//一个播放按钮的图片 var video=document.getElementById("video");//video标签对象 video.currentTime；//获取视频当前播放时间

//如果视频加载完成 播放按钮图片显示，视频图片设置为空，显示视频内容 video.οncanplay=function(){ $("#playimg").show(); $("#video").attr("poster",""); } //视频播放事件，点击播放可以记录学习进度，有获取当前视频播放时间属性 video.οnplay=function(){ if($("#is_record").val()==null || $("#is_record").val()==){ $.ajax({ type : "post", url : ctx+"/traincourserecord/save.shtml", data:{ con_id : $(.now_play).data("id"), course_id : $("#course_id").val() }, success : function(data) { if(data.flag){ }else{ parent.layer.msg("记录学习出现错误"); } }, error: function(data) { parent.layer.msg("记录学习出现错误"); } }); } $("#playimg").hide(); }; //视频暂停事件 video.οnpause=function(){ $("#playimg").show(); }; //点击播放图片事件 playimg.οnclick=function(){ $("#is_record").val(1); if(video.paused){ $("#playimg").hide(); video.play(); $.ajax({ type : "post", url : ctx+"/traincourserecord/save.shtml", data:{ con_id : $(.now_play).data("id"), course_id : $("#course_id").val() }, success : function(data) { if(data.flag){ }else{ parent.layer.msg("记录学习出现错误"); } }, error: function(data) { parent.layer.msg("记录学习出现错误"); } }); } }; //点击视频周围暂停播放图片出现 video.οnclick=function(){ if(video.play()){ $("#playimg").show(); video.pause(); } };

html 代码 JS代码 var playimg=document.getElementById("playimg");//一个播放按钮的图片 var video=document.getElementById("video");//video标签对象 video.currentTime；//获取视频当前播放时间 //如果视频加载完成 播放按钮图片显示，视频图片设置为空，显示视频内容 video.οncanplay=function(){ $("#playimg").show(); $("#video").attr("poster",""); } //视频播放事件，点击播放可以记录学习进度，有获取当前视频播放时间属性 video.οnplay=function(){ if($("#is_record").val()==null || $("#is_record").val()==){ $.ajax({ type : "post", url : ctx+"/traincourserecord/save.shtml", data:{ con_id : $(.now_play).data("id"), course_id : $("#course_id").val() }, success : function(data) { if(data.flag){ }else{ parent.layer.msg("记录学习出现错误"); } }, error: function(data) { parent.layer.msg("记录学习出现错误"); } }); } $("#playimg").hide(); }; //视频暂停事件 video.οnpause=function(){ $("#playimg").show(); }; //点击播放图片事件 playimg.οnclick=function(){ $("#is_record").val(1); if(video.paused){ $("#playimg").hide(); video.play(); $.ajax({ type : "post", url : ctx+"/traincourserecord/save.shtml", data:{ con_id : $(.now_play).data("id"), course_id : $("#course_id").val() }, success : function(data) { if(data.flag){ }else{ parent.layer.msg("记录学习出现错误"); } }, error: function(data) { parent.layer.msg("记录学习出现错误"); } }); } }; //点击视频周围暂停播放图片出现 video.οnclick=function(){ if(video.play()){ $("#playimg").show(); video.pause(); } };