小视频模块开发进度 3.8日  做个随心笔记以待日后查询

1. 解决谷歌浏览器下VIDEO不自动播放问题 /在VIDEO里面增加虚拟点击事件   【@click="player"】

   
   

   
   

 2.突破其他手机自带浏览器状态下是否正常播放。（暂时未解决  手机自带浏览器 百度浏览器 ）

    解决了 360浏览器  谷歌浏览器 原生下APP   官方仿原生H5APP   套壳APP  火狐浏览器   苹果手机自动播放

【    webkit-playsinline='true' playsinline='true' x-webkit-airplay='true' x5-video-player-type='h5' x5-video-player-fullscreen='true'x5-video-ignore-metadata='true' x5_fullscreen='true' 】

3.增加了播放前先播放片头问题。 以后大家在用到时候可以发挥想象更改为随机的广告即可

   【id="myvideo"】     【ncontextmenu="return false"】

完整VIDEO 调用代码

<video id="myvideo"  preload='auto' src="广告或者片头播放地址" @click="player" oncontextmenu="return false" autoplay="autoplay" webkit-playsinline='true' playsinline='true' x-webkit-airplay='true' x5-video-player-type='h5' x5-video-player-fullscreen='true'x5-video-ignore-metadata='true' x5_fullscreen='true' width='100%' height='100%'><p>不支持video</p></video>

-----------------------------------------JS------------------------------

    $(document).ready(function(){

        video.play();

    });

    var vList = ['视频真实地址.mp4']; // 初始化加载视频

    var vLen = vList.length;//播放列表的长度

    var curr = 0;// 当前播放的视频

    var video = document.getElementById("myvideo");//video调用JS的值

    video.addEventListener('ended', function(){    //播放完毕片头后1

        play();                                                                   //进行播放真实的1

    });                                                                             //视频地址1

    function play() {                                                      //监听

        video.src = vList[curr];

        video.load();   //如果短的话，可以加载完成之后再播放，监听 canplaythrough 事件

        video.play();

        curr++;

        if(curr >= vLen){

            curr = 0; //重新循环播放0为循环 1为不循环

        }

    }

---------------------------------------------------------------------------------------------------