微信小程序：web-view嵌套的h5页面退出后音频没有停止播放的解决方法

微信小程序的web-view可以嵌套h5页面，h5内容可以在小程序上展示。

<web-view src="{{url}}?isLogin={{isLogin}}&id={{id}}&userId={{userId}}></web-view>

传参方式如上
碰到的问题是：当进入到H5页面时，会播放音乐，当返回到小程序或者退出小程序后，在微信聊天界面音频还在继续播放，直到音频播放完毕，这对用户的体验的非常不好。刚开始的做法是在嵌套h5的页面里用onUnload将src中的url设置为空，但是在安卓机上可行，ios上依然在播放，真的是很苦恼，又继续找方法。
直到后面看到了阮一峰的一篇文章（http://web.jobbole.com/95344/）解决了问题

document.addEventListener('visibilitychange', function () {
  // 用户离开了当前页面
  if (document.visibilityState === 'hidden') {
    document.title = '页面不可见';
	var music = document.getElementById("play");
	music.pause();//暂停
  }
 
  // 用户打开或回到页面
  if (document.visibilityState === 'visible') {
    document.title = '页面可见';
	var music = document.getElementById("play");
	music.play();//播放
  }
});

监听网页的可见与不可见，网页不可见时暂停播放，可见时播放。非常感谢阮一峰的分享，这个问题着实排查了很久。