HTML5视频:canPlayType()在Safari中不起作用

时间:2014-12-22 09:30:43

标签: javascript html5 safari html5-video

我尝试在developer.apple.com上编写下面的代码,但它抛出错误说:

  

TypeError:' undefined'不是一个函数(评估' myVideo.canPlayType(myTypes [i])')

<!doctype html>
<html>
<head>
    <title>JavaScript Fallback</title>
    <script type="text/javascript">
        function checkPlaylist() {
            var playAny = 0;
            myTypes = new Array ("video/mp4","video/ogg","video/divx");
            var nonePlayable = "Your browser cannot play these movie types."
            var myVideo = document.getElementsByTagName('video')[0];
            for (var i = 0, len = myTypes.length; i < len; x++) {
               var canPlay = myVideo.canPlayType(myTypes[i]);
                if ((canPlay == "maybe") || (canPlay == "probably"))
                    playAny = 1;
            }
            if (playAny == 0)
                document.getElementById("video-player").innerHTML = nonePlayable;
         }
    </script>
</head>
<body onload="checkPlaylist()" >
    <div id="video-player" align=center>
        <video controls height="200" width="400">
            <source src="myMovie.m4v" type="video/mp4">
            <source src="myMovie.oga" type="video/ogg">
            <source src="myMovie.dvx" type="video/divx">
        </video>
    </div>
</body>
</html>

2 个答案:

答案 0 :(得分:1)

使用以下脚本检查Safari浏览器中的 myTypes 数组参数:

<!DOCTYPE html> 
<html> 
<body> 

<p>Can my browser play DIVX videos? <span>
<button onclick="supportType(event,'video/divx','H.264')" type="button">Test</button>
</span></p>

<p>Can my browser play MP4 videos? <span>
<button onclick="supportType(event,'video/mp4','avc1.42E01E, mp4a.40.2')" type="button">Test</button>
</span></p>

<p>Can my browser play OGG videos? <span>
<button onclick="supportType(event,'video/ogg','theora, vorbis')" type="button">Test</button>
</span></p>

<script> 
function supportType(e,vidType,codType) { 
    var vid = document.createElement('video');
    isSupp = vid.canPlayType(vidType+';codecs="'+codType+'"');
    if (isSupp == "") {
        isSupp = "No";
    }
    e.target.parentNode.innerHTML = "Answer: " + isSupp;
} 
</script> 

</body> 
</html>

答案 1 :(得分:0)

你在Safari for Windows吗?如果是这样,那可能会失败。 Apple不再支持Safari for Windows。

你也有var i = 0, len = myTypes.length; i < len; x++。 最后一次x应为i