javascript - mp4 和 webm 在使用 videojs 时会导致 web 浏览器中的冲突

Question

我使用下面的视频播放器videojs：

<video id="font_video" class="video-js vjs-default-skin" controls preload="none" width="700" height="360" poster="" data-setup="{}">
  <source src="xxx.mp4" type='video/mp4' />
  <source src="xxx.webm" type='video/webm' />
</video>

<script>
   _V_.options.flash.swf = "assets/video-js.swf";
</script>

上述代码在Safari中成功运行，但在Chrome和Firefox中无法运行。

如果我交换mp4和webm位置，如下所示：

<video id="font_video" class="video-js vjs-default-skin" controls preload="none" width="700" height="360" poster="" data-setup="{}">
  <source src="xxx.webm" type='video/webm' />
  <source src="xxx.mp4" type='video/mp4' />
</video>

然后代码不再在Safari中运行，而是在Chrome和Firefox中运行。有人有解释吗？