在使用video.js(版本4.12.11)插件video-js-resolution时尝试绘制多个视频时,我似乎得到了一个TypeError。当然第一个视频工作正常,但任何javascript或任何其他视频后无效。
TypeError: window.videojs[componentClass] is not a constructor
- FireFox
Uncaught TypeError: window.videojs[componentClass] is not a function
- 谷歌浏览器
在video.dev.js上,第(1446)行:
component = new window['videojs'][componentClass](this.player_ || this, options);
这是我的测试页面:
<video id="home_video" controls preload="none" poster="http://img05.deviantart.net/aaee/i/2011/105/c/0/nyan_cat_wallpaper_by_nyakiru-d3e1zfl.png" width="970" height="404" class="video-js vjs-default-skin">
<source src="http://vjs.zencdn.net/v/oceans.mp4?hd" type="video/mp4" data-res="HD" />
<source src="http://vjs.zencdn.net/v/oceans.mp4?sd" type="video/mp4" data-res="SD" />
<source src="http://vjs.zencdn.net/v/oceans.webm?hd" type="video/webm" data-res="HD" />
<source src="http://vjs.zencdn.net/v/oceans.webm?sd" type="video/webm" data-res="SD" />
</video>
<video id="home_video2" controls preload="none" poster="http://img05.deviantart.net/aaee/i/2011/105/c/0/nyan_cat_wallpaper_by_nyakiru-d3e1zfl.png" width="970" height="404" class="video-js vjs-default-skin">
<source src="http://vjs.zencdn.net/v/oceans.mp4?hd" type="video/mp4" />
</video>
<script type="text/javascript">
vjs('home_video', {
plugins: {
resolutions: true
}
});
vjs('home_video2', {
});
</script>
从我猜测video.js试图在一些跟踪后再次在第二个视频上重新加载reolutions插件。但无法得到对象。我不是百分之百确定解决这个问题的最佳方法。
https://github.com/vidcaster/video-js-resolutions
Encase你们中的任何人都在想。为什么我不升级到5,因为我有太多的网站在相同的代码库上运行。