JWPlayer 如何从 Javascript 更改字幕轨道？

Question

在 JWPlayer 中，如何根据我的喜好更改（或设置）字幕轨道.. 让我们通过单击外部 HTML 按钮来说明。

让我们说：

• 如果我点击 html [ Button 1]，视频的标题将是“eng.srt”。
• 如果我点击 html [ Button 2]，视频将带有“esp.srt”的标题。

可能从一开始就没有字幕曲目。相应的字幕轨道将在 html 按钮单击时设置（即使在播放时？）

Answer 1

您可以使用此javascript-api-reference更改字幕

字幕

如果视频提供了一个或多个隐藏式字幕轨道，则这些 API 调用用于收听或更新活动字幕轨道。此 API 可用于记录字幕使用情况或在 JW Player 之外构建您自己的 CC 菜单。

setCurrentCaptions(index) 将可见字幕轨道更改为提供的索引。索引必须在 getCaptionsList 提供的列表内。请注意，索引 0 始终关闭字幕。

onCaptionsList(callback) 在可用字幕轨道列表更新时触发。在播放列表项开始播放后不久发生。事件属性： 轨道（Array）：带有新字幕轨道的完整数组。

onCaptionsChange（回调） 在活动字幕轨道更改时触发。响应于例如用户单击控制栏 CC 菜单或调用 setCurrentCaptions 的脚本而发生。事件属性： track (Number)：getCaptionsList() 数组中新活动字幕轨道的索引。请注意，如果轨道为 0，则字幕关闭。

示例设置

<div id="myElement"></div>
<div id="Off_sub">OFF</div>
<div id="Eng_sub">ENG</div>
<div id="Farsi_sub">FARSI</div>
<div id="Jap_sub">JAPANESE</div>
<div id="Russ_sub">RUSSIAN</div>

<script>
    jwplayer("myElement").setup({
      playlist: [{
        image: "/uploads/myPoster.jpg",
        file: "/uploads/myVideo.mp4",
        tracks: [
          { file: "/uploads/myCaptionsEn.vtt", label: "English", kind: "subtitles" },
          { file: "/uploads/myCaptionsFa.vtt", label: "Farsi", kind: "subtitles" },
          { file: "/uploads/myCaptionsJa.vtt", label: "Japanese", kind: "subtitles" },
          { file: "/uploads/myCaptionsRu.vtt", label: "Russian", kind: "subtitles" }
        ]
      }]
    });
</script>

YOUR REQUIREMENT

<script>

$("#Off_sub").click(function(){
  jwplayer("myElement").setCurrentCaptions(0);//off the caption
});
$("#Eng_sub").click(function(){
  jwplayer("myElement").setCurrentCaptions(1);//Eng caption
});
$("#Farsi_sub").click(function(){
  jwplayer("myElement").setCurrentCaptions(2);//Farsi caption
});
$("#Jap_sub").click(function(){
  jwplayer("myElement").setCurrentCaptions(3);//Japanese caption
});
$("#Russ_sub").click(function(){
  jwplayer("myElement").setCurrentCaptions(4);//Russian caption
});
</script>

请参阅以下 API 列表以更好地理解：

Javascript API 参考

多个字幕轨道

添加视频字幕

希望能帮助到你 ：）