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

Posted 2023-05-07

【中文标题】HTML5 视频播放器：动态加载视频

【英文标题】：HTML5 video player: dynamically loading videos

【发布时间】：2011-04-05 21:01:25

【问题描述】：

那么，使用兼容 html 5 的视频播放器（如 Video JS）如何动态加载视频，而无需重新加载整个页面？想象一下，一个链接列表（类似于播放列表），每个链接都指向一个视频。单击链接时，我想将所选视频加载到播放器中。

目前，我正在使用一个包含视频播放器的 Iframe，所以基本上我将一个变量传递给 Iframe，然后重新加载它。出于几个原因，我认为这并不理想；它不允许视频全屏显示，“后退”按钮将 iframe 向后移动，而不仅仅是主页，此外，它还是一个 iframe。我宁愿避免这种情况。

想法？谢谢！

【参考方案1】：

想出了一个简单的解决方案。这是脚本；把这个扔在头上：

function vidSwap(vidURL) 
var myVideo = document.getElementsByTagName('video')[0];
myVideo.src = vidURL;
myVideo.load();
myVideo.play();

然后HREF会调用函数：

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

【讨论】：

旧解决方案，正是我所需要的。简单的。快。