首页 > 代码库 > 针对部分iphone及小米手机不触发seek事件的解决方案
针对部分iphone及小米手机不触发seek事件的解决方案
在做手机页面的时候碰到个需求，就是要求视频不能快进和后退。查到有个seeking和seeked函数应该在寻址的时候触发，但是经过测试发现，4s及小米2以上的浏览器无法触发这两个函数。而且同时无法检测到Media.seeking的状态，打印出来全部是false。
如果去掉controls，在大部分的android手机中都没有问题，不显示控制器。但是小米浏览器会自动全屏播放，控制器包括进度条都会显示出来。iphone也会自动全屏，退出全屏就无法播放视频。但是iphone5以上可以监听到seeking及seeked事件，进而进行控制。
经过提醒突然想到，timeupdate函数会实时触发，可以先缓存上一次触发时的时间，然后下一次触发的时候与上一次的时间进行对比。如果二者之间超过1s，则视为有过跳转。基础是timeupdate的触发时间要小于1s，经过监听及打印，发现这个函数触发时间是毫秒级的，不会超过1s。
相关代码：
var Media; var beforetime=0; var type=0; var temp=0; $(document).ready(function(){ var browser = window.browser; var iosB; if(browser.iPad || browser.iPhone){ iosB=true; } Media=document.getElementsByTagName(‘video‘)[0]; $(‘#start‘).bind(‘click‘,start); $(‘#video_block‘).bind(‘click‘,function(e){ $(‘#start‘).show(); Media.pause(); }); $(‘video‘).bind(‘timeupdate‘,timeupdate); $(‘video‘).bind(‘pause‘,function(){ if(!iosB){ $(‘#start‘).show(); } }); $(‘video‘).bind(‘webkitendfullscreen‘,function(){ var str=$(‘#start‘).css(‘display‘); if(str=="none"&&!iosB){ $(‘#start‘).show(); } }); $(‘video‘).bind(‘ended‘,function(){ $(‘.next‘).show(); }); }) function timeupdate(){ if(Media.currentTime-beforetime>1){ Media.currentTime=0; } else if(Media.ended){ $(‘.next‘).show(); } beforetime=Media.currentTime; } function start(){ $(‘#start‘).hide(); Media.play(); }
针对部分iphone及小米手机不触发seek事件的解决方案
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。