5

更改视频源（通过 setSrc() 方法）时，如何动态更改字幕的源文件（最初通过 <track> 元素在 HTML 中定义）？

换句话说，在播放视频时，我使用 setSrc() 方法来更改视频源，并且我还会重新定义链接的字幕文件 (SRT)。

4

3 回答 3

6

我设计的一个技巧是在字幕轨道上设置一个 ID

<track id="subtitles" kind="subtitles" src="subtitles.srt" srclang="en" />

然后在您需要的任何事件中，您可以使用：

$('#subtitles').attr('src', 'different_subtitles.srt');
player.findTracks();
player.loadTrack(0);
player.setSrc('different_video.mp4');

可能有一种更优雅的方式来解决这个问题，MediaElementJS 确实应该为此提供一个 API。但与此同时，这个技巧应该可以让你度过难关。

于 2012-01-24T13:18:37.573 回答
2

这并不适用于每个事件（如“结束”）。虽然此代码确实可以可靠地加载和更改 TRACK 源，但如果您已经显示了一种语言，它不会显示带有新视频的新“来源”TRACK，除非 CC 设置为 None 然后是一种语言。

于 2012-09-07T21:02:43.277 回答
2

另一种方法是删除整个video元素并用一个新video元素替换它的所有新track元素。

您可以通过替换 的video父元素的 innerHTML 来实现：

document.getElementById('videoparent').innerHTML='<video src="url-to-my-video.mp4" controls=""><track src="url-to-my-subtitle.vtt" default="" srclang="de" label="My subtitle"></video>';

至少在 Firefox 87 和 Chromium 89 中运行良好。

于 2021-04-08T20:33:49.357 回答