如何退出微信X5同层播放器？

H5同层播放器接入规范：https://x5.tencent.com/tbs/guide/video.html

Android端的微信有一个神奇H5(X5)同层播放器。为啥神奇？这里不能骂脏话咱们还是换一个话题吧。

开启X5同层播放器的方法

在video标签上加上x5-video-player-type="h5" x5-video-player-fullscreen="true" 就开启了X5同层播放器了，当视频开始播放回自动进入X5同层播放器

属性解释
x5-video-player-type="h5" 声明启用同层H5播放器
x5-video-player-fullscreen="true" 视频在播放时进入到全屏模式
更多属性自己看官方文档（文章最上面有链接）

监听X5播放器进入与退出全屏

监听video的x5videoenterfullscreen x5videoexitfullscreen事件

属性解释
x5videoenterfullscreen：进入全屏通知
x5videoexitfullscreen：退出全屏通知
详细用法自己看官方文档吧

X5播放器怎么退出呢？

官网并没有给出退出的方法，查阅无数资料也没有找到。项目要求播放完要退出做分享或者其它事，怎么办？怎么办？怎么办？
无意间发现了一个H5案例，他是怎么退出的。然后把他压缩过的代码不断的分析，我竟然知道了他怎么做的。瞬间开心的不得了。

退出办法：
给video标签设定video.style.display="none"的样式X5就退出了
监听退出通知中再设置回来就搞定了video.style.display=""
给video的父级标签设置display也同样生效
再开心一会，哈哈哈哈～～～～

什么？同时开启两个X5退出白屏，MDD!!!

我想这个坑可能大多数人都不会遇到，因为很少有需求要开启两个X5，但我们公司要做视频无缝切换，需要开启两个，两个啊。一时又陷入了尴尬，还是各种查各种查不到。领导非常重视这个bug，开早会特意和我说，今天把其它工作放一放，就解决这个问题。瞬间压力山大。开启一天的各种情况测试。我C我发现问题的关键了。竟然和退出顺序有关系！

白屏原因
竟然是退出顺序不对，先开启的要后退出（先进后出原则）

解决办法
1.监听进入X5：监听到把已经进入的存到一个数组中。
2.从最后一个开始退出：取出数组中最后一个，然后进行退出，监听退出成功后再退出第一个。
注意：要在第二个退出成功后再退出第一个，也可以采用第二个在定时器中退出

X5退出的问题终于解决了，分享给小伙伴希望对你们有帮助。
文章是我原创，欢迎收藏转载，转载请注明出处。
出处：https://www.jianshu.com/p/5a770e984d5c