HTML5 视频：如何关闭字幕

Question

我正在创建一个 HTML5 视频播放器，并且想要一个可以打开和关闭字幕的按钮。 为了关闭它们，我将默认轨道的“模式”属性设置为“隐藏”，但它们并没有在 Chrome 66 中消失。

这是应该关闭字幕的 jQuery 行（播放器的 id 是“player”）：

$"#player track").eq(0).attr("mode", "hidden");

DOM 中的“mode”属性更改为“hidden”，但字幕仍然可见。 知道为什么会这样吗？

Answer 1

扩大我的评论； 您应该尝试的是在所有音轨上禁用字幕（以防您有多个字幕）。 使用jQuery可能有一种更简单的方法，但是我从来没有使用jQuery来处理html5播放器，因此我得到了答案。

var video = document.querySelector('#player');

for (var i = 0; i < video.textTracks.length; i++) {
   video.textTracks[i].mode = 'hidden';
}

Answer 2

var video = document.querySelector('#player');

for (var i = 0; i < video.textTracks.length; i++) {
   if(video.textTracks[i].mode == 'hidden')
          video.textTracks[i].mode = 'showing';
   else
          video.textTracks[i].mode = 'hidden';
}