音频/视频那些坑

来源：互联网发布：mysql select into 编辑：程序博客网时间：2024/06/03 22:19

音频/视频那些坑

  坑1:关于html5 video currentTime 在chrome浏览器下设定失败问题解决     chrome下src需要在线视频完整引用地址  坑2:window.onload方式获取audio.duration的值为NaN     监听oncanplay  坑3：js动态创建音频数量>6条以后，则无法显示

这里写图片描述

ex:<video width="300" height="" id="myVideo" autobuffer="true" controls="controls">        <source src="http://ofuamxwhl.bkt.clouddn.com/2mengmusanqian.mp4" type="video/mp4"></source></video>    <p></p>    <button type="button" id="forward" onclick="forward()">快进15s</button>    <button type="button" id="defaultPlaybackRate" onclick="defaultPlaybackRate()">速率/2</button>    <script type="text/javascript">        window.onload = function() {            var myVideo = document.getElementById("myVideo");            //视频播放，快进视频触发 ontimeupdate是事件            myVideo.oncanplay = function(){                console.log("总时间" + myVideo.duration);            }            myVideo.ontimeupdate = function() {                console.log("当前时间:" + myVideo.currentTime);                if(myVideo.ended) {                    console.log("视频播放结束");                }            }        };        function forward() {            myVideo.currentTime += 15;        }        function defaultPlaybackRate() {            myVideo.defaultPlaybackRate = 0.5;            myVideo.load();        }    </script>

视频/音频格式播放检测

canPlayType 返回probably maybe 空字符串    function checkAudio() {        var myAudio = document.createElement("audio");        if(myAudio.canPlayType) {            if("" != myAudio.canPlayType('audio/mpeg')) {                document.write("您的浏览器支持mp3编码。<br>");            }            if("" != myAudio.canPlayType('audio/ogg; codecs="vorbis"')) {                document.write("您的浏览器支持oog编码。<br>");            }            if("" != myAudio.canPlayType('audio/mp4; codecs="mp4a.40.5"')) {                document.write("您的浏览器支持aac编码。");            }        } else {            console.log("您的浏览器不支持要检测的音频格式");        }    }    function checkVideo() {        var myVideo = document.createElement("video");        if(myVideo.canPlayType) {            if("" != myVideo.canPlayType('video/mp4;codecs="avc1.64001E"')) {                document.write("您的浏览器支持 h264 编码。<br />");            }            if("" != myVideo.canPlayType('video/ogg;codecs="vp8"')) {                document.write("您的浏览器支持 vp8 编码。<br />");            }            if("" != myVideo.canPlayType('video/ogg;codecs="theora"')) {                document.write("您的浏览器支持 theora 编码。<br />");            } else {                console.log("您的浏览器不支持要检测的音频格式");            }        }    }    window.onload = function() {        checkAudio()；        checkVideo()    }

Tips

//播放(继续播放)audio.play();//暂停audio.pause();//停止audio.pause();audio.currentTime = 0;//重新播放audio.currentTime = 0;audio.play();

阅读全文

0 0