[html5]判断浏览器是否支持播放这种视频格式canPlayType方法
与使用向网页中添加 HTML5 视频控件中所示的 source 元素相比,从 JavaScript 中确定要使用的格式稍微复杂一点。但是,由于视频元素的支持不会更改,因此在你确定可用的支持之后,便可以为余下的浏览 会话进行格式假设。 若要查找浏览器的格式功能,请使用 video 对象的 canPlayType 方法。 canPlayType 方法带有一个视频 MIME 类型以及一个可选的编解码器参数,并且返回三个字符串之一:"empty"、"maybe" 或 "probably"。
- if (myvideo.canPlayType) {
- // CanPlayType returns maybe, probably, or an empty string.
- var playMsg = myvideo.canPlayType('video/mp4; codecs="avc1.42E01E"');
- if ("" != playMsg) {
- msg.innerHTML += "mp4/H.264 is " + playMsg + " supported <br/>";
- }
- playMsg = myvideo.canPlayType('video/ogg; codecs="theora"');
- if ("" != playMsg) {
- msg.innerHTML += "ogg is " + playMsg + " supported<br/>";
- }
- playMsg = myvideo.canPlayType('video/webm; codecs="vp8, vorbis"');
- if ("" != playMsg) {
- msg.innerHTML += "webm is " + playMsg + " supported<br/>";
- }
- }
- else {
- msg.innerHTML += "no video support";
- }
- }
"maybe" 和 "probably" 之间的差别通常是 canPlayType 方法没有足够的信息。例如,如果缺少编解码器参数,则该方法可返回 "maybe" 以便支持 mp4。这是因为可能有不受支持的 mp4 编解码器。编解码器参数将这种支持限制为更具体的 mp4 文件版本。
canPlayType 方法返回的这三种不明确的状态使得确定浏览器是否支持该文件格式成为一项挑战。尽管不是规则,但如果浏览器返回 "maybe",则通常表明该浏览器可以支持该格式。如果返回的字符串为 "maybe"、"probably",则以下语句返回布尔型 true,如果字符串为空,则返回 false。
热门文章推荐
- 10款html5网页播放器推荐(总有一款适合你)
- [html5]html5+css3实现图片斜角切成直角梯形显示的源代码
- [HTML5]HTML5视频video时间事件代码
- [微信]iOS苹果和微信中音频和视频实现自动播放的方法
- [html5]html5视频全屏实现的源代码
- [Html5]mobile-agent移动Agent,就是具有移动性的智能Agent
- [html5]视频播放器js控制vedio视频和分段播放
- [html5]H5播放器:竖屏播放\横屏播放\跟随旋转例子