VideoJS字幕菜单未显示

时间:2015-11-24 14:51:22

标签: javascript html video.js

我有一个问题,我在网上搜索但我似乎无法找到解决方案。

我收到了这段代码

     <!doctype html>
<head>
    <title>Video.JS Example</title>
    <link href="//vjs.zencdn.net/5.2.2/video-js.css" rel="stylesheet">
    <script src="//vjs.zencdn.net/5.2.2/video.js"></script>
</head>
<body>
    <div style="width:700px;margin:0px auto;">
        <video id="example_video_1" class="video-js vjs-default-skin"
               controls preload="auto" width="640" height="264"
               poster="http://video-js.zencoder.com/oceans-clip.png"
               data-setup='{"controls":true}'>
            <source src="http://x/watch/Inside.Out.HD1080.mp4" type='video/mp4' />
<track src="http://x/watch/subtitles/en/Inside.Out.HD1080.vtt" srclang="en" label="English"/>
        </video>
    </div>
</body>

但是当我运行它时一切正常但字幕选择不显示 在这里看: enter image description here

1 个答案:

答案 0 :(得分:0)

在加载videojs后,将此功能添加到您的javascript中。

            function loadCaptionsifAny() {
                var video = document.getElementsByTagName("video")[0];
                track = document.createElement("track");
                track.kind = "captions";
                track.label = "English";
                track.srclang = "en";
                track.src = "captions/captions.vtt";
                video.appendChild(track);
                video.textTracks[0].mode = "showing";
            }

希望这能解决您的问题!