HTML5视频播放器:动态加载视频

Ben*_*son 12 video html5 dynamic html5-video

因此,使用符合HTML 5的视频播放器(如Video JS),如何动态加载视频,而无需重新加载整个页面?想象一下,一个链接列表(类似播放列表),每个链接指向一个视频.单击链接时,我想将选定的视频加载到播放器中.

目前,我正在使用一个持有视频播放器的Iframe,所以基本上我将一个变量传递给Iframe,然后重新加载它.由于一些原因,我不认为这是理想的; 它不允许视频全屏显示,后退按钮不仅仅移动iframe主页,而且还有iframe.我宁愿避免这种情况.

想法?谢谢!

Ben*_*son 26

想出了一个简单的解决方案.这是剧本; 抛出这个头:

function vidSwap(vidURL) {
var myVideo = document.getElementsByTagName('video')[0];
myVideo.src = vidURL;
myVideo.load();
myVideo.play();
}
Run Code Online (Sandbox Code Playgroud)

然后HREF将调用该函数:

<a href="#" onClick="javascript:vidSwap('myMovie.m4v'); return false;">Link</a>
Run Code Online (Sandbox Code Playgroud)