javascript - 使用 和

Question

如何使用<track>在视频中？我想当鼠标放在这个单词上时从轨道文本中获取单词。

var track = document.getElementById('ger').track;
var cues = track.cues;
var active_cues = track.activeCues;
var text = active_cues[0].text;
console.log(text);

<video id="video" width="320" height="240" controls>
  <source src="Video/video.mp4" type='video/mp4'>
   <track id="ger" kind="subtitles" src="Video/Twitter_in_Plain_English_ger.vtt" srclang="de">
</video>

Answer 1

根据轨道的文档，我认为您想要的内容如下所示:

var videoElement = document.querySelector("video");//get video element where you want tracks
var track = videoElement.textTracks[0]; //get first track element that contains cues
var activeCue = track.activeCues[0]; //get first active cue
var cueText = activeCue.text; // get the text of active cue
console.log(cueText); display text in dev console

此外，这里有一个关于使用轨道的完整教程:https://www.html5rocks.com/en/tutorials/track/basics/