添加一個帶有爆米花TTML字幕的視頻元素

我有一個頁面，我想用TTclickJS插入一個帶有TTML字幕的視頻元素，如您在this Fiddle中所看到的。除字幕外，所有的工作都很好。他們不顯示。當我做一些類似<video src="myvideo.mp4" data-timeline-sources="data.ttml" />的字幕時，字幕正常工作。添加一個帶有爆米花TTML字幕的視頻元素

所以我在這裏做錯了什麼，或者它只是不可能與PopcornJS插入video元素，設置data-timeline-sources屬性和播放與該字幕文件的視頻？

我data.ttml字幕文件看起來是這樣的：

<tt xmlns:tts="http://www.w3.org/2006/04/ttaf1#styling" xmlns="http://www.w3.org/2006/04/ttaf1"> 
<body region="subtitleArea"> 
    <div> 
    <p xml:id="subtitle1" begin="0.50s" end="2.5s"> 
     Test subtitle 1 
    </p> 
    <p xml:id="subtitle2" begin="3.0s" end="5.0s"> 
     Test subtitle 2 
    </p> 
    <p xml:id="subtitle3" begin="5.5s" end="8.5s" > 
     Test subtitle 3a<br/> 
     Test subtitle 3b 
    </p> 
    <p xml:id="subtitle4" begin="9.5s" end="12.0s"> 
     Test subtitle 4 
    </p> 
    <p xml:id="subtitle5" begin="13.0s" end="15.0s"> 
     Test subtitle 5 
    </p> 
    </div>  
</body> 
</tt>

來源

2013-05-14 Maarten Janssen