当所有类型不支持

在HTML5规范，它建议你把备用材料在<video>标记为不支持旧版本浏览器的HTML5视频后备。当所有类型不支持

<video width="400" controls> 
    <source src="mov_bbb.mp4" type="video/mp4"> 
    <source src="mov_bbb.ogg" type="video/ogg"> 
    Your browser does not support HTML5 video. 
</video>

但是，当所有源类型不受支持时，我找不到任何回退。例如，我的Chromium浏览器不能播放video/mp4，但它可以播放video/ogg。所以我希望这会呈现回退文本。

<video width="400" controls> 
    <source src="mov_bbb.mp4" type="video/mp4"> 
    Your browser does not support HTML5 video. 
</video>

相反，我只是得到一个没有任何内容的视频播放器，因为它无法加载mp4文件。

有没有办法在HTML 5视频回退时，有没有可用的视频源？我意识到我尝试的回退只适用于旧版浏览器，但我仍然需要一个回退功能，因为没有可用的源代码。

来源

2015-09-07 Josh

回退时，才会显示如果_HTML5'

@Xufox我意识到这一点，但如果它无法呈现任何源代码，我仍然需要一种方法来进行回退。 – Josh

如何使用['canPlayType']（http://stackoverflow.com/a/7451727）？ – Xufox

实际上，当您尝试在<source>元素中加载不受支持的媒体类型时，会触发error事件。
然后，您可以监听这些事件，如果没有的来源是公认的，触发回退：

var sources = document.querySelectorAll('source'); 
 
var source_errors = 0; 
 
for (var i = 0; i < sources.length; i++) { 
 
    sources[i].addEventListener('error', function(e) { 
 
    if (++source_errors >= sources.length) 
 
     fallBack(); 
 
    }); 
 
} 
 

 
function fallBack() { 
 
    document.body.removeChild(document.querySelector('video')); 
 
    document.body.appendChild(document.createTextNode('No video with supported media and MIME type found')); 
 
}

<video controls> 
 
    <source src="foo.bar" type="video/foo" /> 
 
    <source src="bar.foo" type="video/bar" /> 
 
</video>

来源

2015-09-07 03:56:10 Kaiido

@ Jaw.sh有两个常用的备用选项。

今天的浏览器（歌剧我不知道，并没有真正关心的），都能够播放MP4 H.264。所以你不应该太担心不兼容问题，除非你的观众大多住在中国。

来源

2015-09-07 03:29:31 zer00ne

您应该阅读第一个链接接受的答案下的评论：“请记住，即使Flash本身无法原生读取视频，也不会在Flash浏览器中使用Flash后备功能，并且在第二个链接中：”使用直接链接后备如果浏览器不支持html5（某些移动设备）：“。 OP想知道是否没有识别源类型，所以它假定浏览器支持'videoElement' – Kaiido

Flash可以在任何非移动浏览器中播放，前提是他们拥有无处不在的Adobe插件。是的，移动不直接下载，同意。所以让我重读一下这个问题......是的，OP没有提到移动设备。让我戴上我的老花镜....不过还是没有看到它顺带提到。移动是一种完全不同的复杂性，OP担心诸如后备这样的基本问题。 – zer00ne

不，我的意思是，如果浏览器确实支持'

当所有类型不支持

回答

相关问题