[在epub中使用JavaScript在单击按钮时显示元素，并记住以下页面中的值

Question

我正在InDesign中的epub上工作。我在文档的“主页”上创建了一个按钮，并创建了一个包含一些文本的元素。如果单击该按钮，则元素应消失以显示下面的内容。我想要实现的是，通过单击按钮可以保存按钮的状态，因此，当将页面翻到与以前页面相同（被覆盖或未被覆盖）时，直到用户再次单击。我写了JavaScript，是因为我认为我可以立即“操纵” epub的所有页面来实现这一目标。不幸的是，我的方法存在两个可能相关的问题，因此我将它们一起发布：

---

1]]我在导出窗口中添加了js文件，InDesign会自动将脚本标签放入每个xhtml文件头部的js文件中。当我打开xhtml文件时，出现“未捕获的TypeError：无法读取未定义的属性'style'”错误。但是，当我手动将其放在正文部分的末尾时，该脚本可以工作。

var cover = document.getElementsByClassName("cover")[0];
var button_none = document.getElementsByClassName("button_none")[0];
var button_inline = document.getElementsByClassName("button_inline")[0];

// var button_status = 1;

if (button_status ==1){
    button_none.style.display ="inline";
    button_inline.style.display ="none";
    cover.style.display = "inline";
}
else{
    button_none.style.display ="none";
    button_inline.style.display ="inline";
    cover.style.display = "none";
}

button_none.onclick = function() {
    cover.style.display ="none";
    button_none.style.display ="none";
    button_inline.style.display = "inline";
    // button_status = 0;
    // return button_status;
    }

button_inline.onclick = function() {
        cover.style.display ="inline";
        button_none.style.display ="inline";
        button_inline.style.display = "none";
        // button_status = 1;
        // return button_status;
        }
由于epub的每个页面都是一个单独的xhtml文件，因此在每个文件中进行更改都非常耗时。也许有更好的方法可以完成这项工作，或者这甚至与第二个问题有关？

2）

因为每个页面都是一个单独的xhtml文件，所以我使用变量“保存”按钮状态的方法不起作用，因为在下一页上它并不相同。我从来没有使用过在不同文件之间传递变量的方法，这就是为什么我不知道我的方法是否可以像我认为在确定如何传递变量时那样工作？

另一个想法是设置一个“数据值”来保存按钮状态，但是与此同时，我也不知道如何在100多个页面的epub中传递它。我对此进行了一些研究，但只发现了表单的get-methode，但在我的案例中我什么也不能使用。

---

如果有人可以帮助我，我会很高兴，因为我自己尝试我一无所获。也许我的整个方法从一开始就不好？

在台式机上，我使用AZARDI打开epub，在移动式Kobo Books或Infinity阅读器上，并使用Chrome浏览器检查xhtml文件。

我正在InDesign中的epub上工作。我在文档的“主页”上创建了一个按钮，并创建了一个包含一些文本的元素。如果单击该按钮，则元素应消失以显示...

Answer 1

EPUB3查看器在受限的浏览器环境中运行。它们具有与完整的Web浏览器相同的功能，但不是全部。您提到打开了一个生成的XHTML文件，但是没有说如何。如果您使用的是Firefox或Google Chrome浏览器，则说明文件测试不正确。