微信小程序退出,web-view里h5音乐继续播放问题解决

·  阅读 304

先说结论,那就是通过监听visibilitychange事件

这个问题,首先看你的需求是不是要在页面切换的时候停止播放,对我们的项目来说,播放的是对景点的详情解说,由于景点的文字解说在小程序页面,所以当webview里面的音乐播放的时候,用户从webview返回到小程序页面时,不希望播放的解说停止,所以我们对这个不作处理。

不过,刚开始也找了解决方案,经过测试,安卓,ios都可以实现对播放的停止。

visibilitychange事件:当其选项卡的内容变得可见或被隐藏时,会在文档上触发 visibilitychange (能见度更改)事件。

document.addEventListener("visibilitychange", function() {
  if (document.visibilityState === 'visible') {
    backgroundMusic.play();
  } else {
    backgroundMusic.pause();
  }
});
复制代码

可以通过判断document.visibilityState 是否为 'visible' 或者 判断document.hidden是否为true去判断当前页面是否被隐藏

分类:
前端
标签:
分类:
前端
标签:
收藏成功!
已添加到「」, 点击更改