Javascript 最小化iPad浏览器safari时仍在播放音频

我开发的游戏是html5，Jquery，Javascript，我需要预装几个音频。这些音频正在一个接一个地播放，但当我最小化iPad时，音频仍在付费。

---

当浏览器将最小化时，任何人都可以帮助暂停音频。当浏览器进入前台时，音频应该会播放。

我已经为您提供了完整的解决方案。以下是我目前掌握的情况：

var audio = document.getElementsByTagName('audio')[0];
window.onpageshow = function() {
    audio.play();
}
window.onpagehide = function() {
    audio.pause();
}

因此，只要您在关闭Safari时打开应用程序选项卡，它就会暂停音频。当你重新开始时播放它。当您更改选项卡时，它不会停止

如果您的应用程序支持苹果移动网络应用程序，当您使用主屏幕按钮打开应用程序时，这将触发

onpageshow

，并在关闭应用程序时暂停。它不会完全暂停，因为打开它会强制它从头开始。您必须使用localStorage或其他工具捕获您在曲目中的位置，然后在打开它时将

currentTime

设置为该位置

看起来你可以在iOS 7中使用

看在历史的份上，我至少要陈述一些我尝试过的其他事情

• window.onblur
• 使用带有设置超时的requestAnimationFrame（这在台式机上有效，但在iOS上无效）

---

希望我没有迟到回答。我发现下面的解决方案适用于桌面和ios设备（还没有在android中注册）
PS：你的音频是一个变量，你必须定义它
我发现了这个解决方案
我建议您使用，它提供了一个事件，告诉您页面的可见性何时发生变化

function handleVisibilityChange() {
    if (document.hidden){
        stopAllSounds();
    }else{
        playAllSounds();
    }
}

document.addEventListener("visibilitychange", handleVisibilityChange, false);

---

stopAllSounds

和

playAllSounds

将按您认为合适的方式定义，但当Safari最小化和最大化时，此事件将触发。它可以在Android设备上运行，非常感谢Kalley这一有价值的解决方案。

$(window).on("blur focus", function(e) {
var prevType = $(this).data("prevType");

if (prevType != e.type) {   //  reduce double fire issues
    switch (e.type) {
        case "blur":
            // do work
            your_audio.pause();
            break;

        case "focus":
            // do work
            your_audio.play();
            break;
    }
}

$(this).data("prevType", e.type);
})

function handleVisibilityChange() {
    if (document.hidden){
        stopAllSounds();
    }else{
        playAllSounds();
    }
}

document.addEventListener("visibilitychange", handleVisibilityChange, false);