音频仍然在jquery移动页面导航后播放

Question

如果这确实被问及在其他地方得到解答，我会道歉道歉......我已经重写并用谷歌搜索了几天没有运气来解决这个问题。

我承担了我的网页设计顶级课程的代码编写职责，我们将打印出版物转换为数字格式。我们决定使用jquery-mobile框架。在此努力之前，我没有经历过jquery，但我学得很快，并且非常享受它。我在我们的网站上使用jquery-ui，它使用一个长的index.html文件和data-role =“page”导航。网站内部是书面作品，其中一些有音频旁白。

我已经使用了html音频标签：

<audio controls>
  <source src="audio/source.mp3" />
  <source src="audio/source.ogg" />
</audio>

音频播放得很好，但是当我导航到另一个“页面”时，音频不会停止，除非刷新整个站点或点击暂停按钮。我所理解的是，虽然从视觉上看，网站在不同页面之间，浏览器只是在一个单独的html文件中移动，只显示它被告知要显示的部分。

是否有一些基本的js代码可以插入到我的页面某个地方，告诉它在点击链接或按钮时，停止正在播放的任何音频？让我重申一下导航是在一个html文件中完成的，而不是通过链接到不同的html文件。

（1000为冗长的故事道歉....认为我应该具体）

感谢您提供的所有帮助和建议

Answer 1

导航到另一个页面pagebeforehide时会触发。在此阶段，请在该页面中找到audio并.pause()。

$(document).on('pagebeforehide', function () {
 $(this).find('audio').each(function () {
  $(this)[0].pause();
 });
});