javascript - 如何仅防止 Ibooks 固定布局书中的翻页事件？

Question

我正在尝试为 ibooks 朗读固定布局书创建一个停止/开始按钮，并且我想防止页面在此按钮的位置翻转。HTML 元素如下所示。

<p ibooks:readaloud="startstop" id="rass" ontouchstart="prevent(event)">SS</p>

javascript如下。

function prevent(event){
    event.preventDefault();
}

所以 ibooks:readaloud 属性会在 p 标签被触摸时开始和停止朗读，但是，防止触摸时的默认行为也会阻止 ibooks:readaloud 属性的行为。

有没有办法让我手动开始和停止大声朗读，或者只防止翻页？

Answer 1

将此代码添加到您的 HTML 文件中：

<p ibooks:readaloud="startstop" id="rass">&#x2735;</p>

并将其放入您的 CSS 文件中：

html p#raplay {
    top: 955px;
    left: 700px;
    color: green;
    padding: 0px 6px 0 10px;
    background: white;
    border: 2px solid black;
    border-radius: 15px;
}

 html p#rastop {
    top: 955px;
    left: 700px;
    padding: 0px 6px 0 10px;
    color: red;
    display: none;
    background: white;
    border: 2px solid black;
    border-radius: 15px;

}

html p#rass {
    top: 955px;
    left: 700px;
    padding: 2px 6px 4px 8px;
    color: green;
    background: white;
    line-height: 40px;
    border: 2px solid black;
    border-radius: 15px;
}

html.-ibooks-media-overlay-enabled p#raplay {
   display: none;
   }
html.-ibooks-media-overlay-enabled p#rastop {
display: block;
}

如果该 p 标签点击，朗读将停止。这是朗读的默认设置。你不需要使用javascript。