在 iBooks 中翻页时 Javascript 间歇性触发

Question

我正在尝试在我的电子书中添加播放音频的功能，以便用户能够根据需要暂停和启动。

我可以在 javascript 中通过控制页面上的标准 HTML5 音频标签来做到这一点，但是当用户翻页时，我希望下一页记住状态，即音频是否暂停。

问题似乎是，当每个页面打开时，javascript 有时会触发，有时不会。我已经尝试添加一个标准监听器

'document.addEventListener("DOMContentLoaded", function(event) { `

在 HEAD 中，但这并不总是在页面翻转时触发。当我在 Chrome 中尝试时，它运行良好。

任何帮助将不胜感激

编辑：这是我要运行的代码：

document.addEventListener("DOMContentLoaded", function(event) { 
  do work
    if (document.getElementById("audioreadalong") && localStorage.playaudio == "1"){
        if (localStorage.isPaused == "0"){
            document.getElementById("audioreadalong").play();
            if (document.getElementById("play") && document.getElementById("pause")){
                document.getElementById("play").setAttribute("style", "display: none;");
                document.getElementById("pause").setAttribute("style", "display: block;");
            }
        }
        else if (localStorage.isPaused == "1"){
            document.getElementById("audioreadalong").pause();
            if (document.getElementById("play") && document.getElementById("pause")){
                document.getElementById("play").setAttribute("style", "display: block;");
                document.getElementById("pause").setAttribute("style", "display: none;");
            }
        }
    }
    else if(localStorage.playaudio == "0"){
        if (document.getElementById("play") && document.getElementById("pause")){
            document.getElementById("play").setAttribute("style", "display: none;");
            document.getElementById("pause").setAttribute("style", "display: none;");
        }
    }
});

这是在我需要音频的每个页面的开头引用的（奇数，右侧不是偶数左侧 - 每个双页是 2 个单独的网页）。

此代码不会在每次翻页时运行。它在 Chrome 中执行，因为每个页面每次都重新加载。我在 epub3 规范中看不到任何可以解释这一点的内容。

最终编辑：我只能假设 a) iBooks 在页面上运行 javascript 的方式存在错误；或 b) 我配置错误。通过使用 Apple 对Read Along Books in their Asset Guide 的内置支持，我已经解决了我的问题。我已经从 iTunes 下载了示例项目，现在我将 SMILs 与 iBooks 命名空间和 iBooks.js（在示例项目中找到）一起使用。如果有人需要这篇文章的帮助，请在此处提问并参考。

感谢那些试图提供帮助或支持的人。

Answer 1

您必须像这样将音频的当前状态存储在本地存储中：

localStorage.setItem("audioState", "true");

只需使用以下方法检索本地存储的值：

localStorage.getItem("audioState");

并相应地执行条件...