zoukankan      html  css  js  c++  java
  • 在微信端使用video标签,播放结束会出现QQ浏览器推荐视频的解决办法(vue)

    会出现播放结束显示QQ浏览器推荐视频的原因:(我是vue的项目,而且我是新手,只是单纯的给大家分享一个方法,代码比较low请自动忽略)

      因为在x5(QQ浏览器)内核中,把video标签劫持了,只要是检测到使用了video标签的话(包括使用了基于h5的video写的插件),就会出现这种情况。

    解决办法:

      html部分:(需要的是一个id选择器,其他的请忽略,src中的内容是调接口返回)

        <video autoplay id="end" controls :src="chapter.url" poster="http://eres.xgstars.com/promote/ed.png"></video>

      js部分:

        showOtherVideo(){
          let _this = this;
          setTimeout(function(){
            var dom = document.getElementById('end');
            var flag = dom.paused;
            if(!flag){
              _this.showOtherVideo();
            }else{
              // _this.showOtherVideo();
              if(dom.currentTime == dom.duration && dom.currentTime!=0){ 
                //这里的判断是如果视频的总时间等于视频已经播放的时间,并且视频的播放时间不为零时
                //这个地方的就是写视频结束的时候的代码的地方
              }else{
                _this.showOtherVideo();
              }
            }
          },1000)
        },
     
      这个的原理就是通过一个计时器每隔一秒刷新一次,来监听视频是不是播放完毕,如果没有播放完毕则继续监听,如果播放完毕就执行下面的方法,可以调用你自己公司的接口来请求下一段视频,替换当前视频,他会有一秒的闪烁,然后就会跳走,如果先看看效果的话,就去微信浏览器里面看看优酷,他们就是这种效果,但是方法应该不会这么low。
  • 相关阅读:
    打开模拟器genymotion 的设置 查询设置的包名
    python 地板除 向下取整 取比目标结果小的的最大整数
    python 复数
    python 0.1+0.2 不等于0.3 的处理办法
    python 利用随机数的种子,复现随机数
    小程序 单独页面的js文件里设置 数据绑定
    问题集
    2020软件工程个人作业06——软件工程实践总结作业
    2020软件工程作业05
    2020软件工程作业04
  • 原文地址:https://www.cnblogs.com/ittian/p/7821891.html
Copyright © 2011-2022 走看看