我无法获得一个从WebVTT文件读取元数据的工作示例,该文件由HTML5页面中的<track>元素指定<video>.为了清楚起见,我不是在谈论从视频文件本身读取元数据(例如,与MPEG传输流一样).我所说的<track>是用于标题视频的元素.a的一个属性<track>是kind,可以指定为以下任何值:
我正在尝试使用元数据类型来访问存储在相应WebVTT文件中的文本,我打算使用JavaScript进行操作.我知道这是可能的,正如Silvia Pfeiffer以及Captionator的制造者所提到的,这是我用来实现解释<track>标签功能的JavaScript polyfill.但是,我无法让它发挥作用.
我的代码基于Captionator文档的标题示例.我添加了一个按钮来检索元数据并在单击按钮时显示它.不幸的是,它一直显示"未定义"而不是元数据.任何想法我可能做错了什么？或者,有没有人知道我可以看看哪个工作示例？我找不到任何地方.
如果您想看看我的代码,我将其包含在下面:
<!DOCTYPE html>
<html>
<head>
<title>HTML5 Video Closed Captioning Example</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" media="screen" href="js/Captionator-v0.5-12/css/captions.css"/>
</head>
<body>
<h1>HTML5 Video Closed Captioning Example</h1>
<div>
<p id="metadataText">Metadata text should appear here</p>
<input type='button' onclick='changeText()' value='Click here to display the metadata text'/>
</div>
<video controls autobuffer id="videoTest" width="1010" height="464"> …