1

我开发的游戏是 html5、Jquery、Javascript，我需要在其中预加载几个音频。这些音频正在一一播放，但是当我将 iPad 最小化时，音频仍在付费。当浏览器最小化时，任何人都可以帮助暂停音频。当浏览器进入前台时，应该播放音频。

4

3 回答 3

1

为您提供完整的解决方案，我已经完成了一半。这是我到目前为止所拥有的：

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

因此，只要您在关闭 Safari 时在应用程序选项卡上，它就会暂停音频。并在您开始备份时播放。当您更改标签时，它不会停止。

如果您的应用程序是apple-mobile-web-app-capable，当您使用主屏幕按钮打开应用程序时将触发onpageshow，并在您关闭它时暂停它。它不会完全暂停，因为打开它会迫使它从头开始。您必须使用 localStorage 或其他东西来捕捉您在轨道中的位置，然后currentTime在您打开它时将其设置为该位置。

根据caniuse.com的说法，您似乎可以在 iOS 7 中使用Visibility API

只是为了历史的缘故，我至少要陈述一些我尝试过的其他事情。

  • 窗口.onblur

  • 将 requestAnimationFrame 与 setTimeout 一起使用（这适用于桌面，但不适用于 iOS）

    var t;
requestAnimationFrame(function checkWindow() {
    if ( audio.paused ) {
        audio.play();
    }
    clearTimeout(t);
    t = setTimeout(function() {
        audio.pause();
    }, 32);
});
于 2013-07-09T04:55:15.097 回答
1

我建议您使用页面可见性 API，它会为您提供一个事件，告诉您页面的可见性何时发生变化。

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

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

stopAllSounds并将playAllSounds根据您认为合适的方式定义，但是当 Safari 最小化和最大化时会触发此事件。它适用于 Android 设备和所有现代平台

于 2016-02-25T20:48:16.987 回答
0

希望我不会迟到回答它。我找到了以下适用于桌面和 ios 设备的解决方案（尚未签入 android）

$(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);
})

PS：your_audio 是一个变量，你必须定义它。

我在这里找到了这个解决方案

于 2014-12-23T23:14:37.793 回答