<!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content="text/html; charset = utf-8"> </head> <script type="text/javascript" charset="utf-8"> function pageLoaded(){ var canvas = document.getElementById('testcanvas');//得到画布 var context = canvas.getContext('2d');//得到绘图环境 参数为绘图环境的类型 //检查音频支持 var audiotest = document.createElement('audio'); var mp3Support,oggSupport,wavSupport; if(audiotest.canPlayType){ /* MP3格式:字符串audio/mpeg;支持的浏览器:IE9+、Chrome Vorbis格式:字符串audio/ogg,codecs=”vorbis”;支持的浏览器:Firefox 3.5+、Chrome、Opera 10.5+ WAV格式:字符串audio/wav,codecs=”1”;支持的浏览器:Firefox 3.5+、Opera 10.5+、Chrome */ mp3Support = "" != audiotest.canPlayType('audio/mpeg'); oggSupport = "" != audiotest.canPlayType('audio/ogg; codecs = "vorbis"'); wavSupport = "" != audiotest.canPlayType('audio/wav,codecs="1"'); } else{ mp3Support = false; oggSupport = false; wavSupport = false; } var soundFileExtn = oggSupport?'.ogg':mp3Support?'.mp3':wavSupport?'.wav':undefined; if(soundFileExtn){ //动态加载audio文件 var audio = new Audio(); //等待音频文件加载完成 然后再播放 audio.addEventListener('canplaythrough',function(){ audio.play(); }); audio.src="/testmusic/8466/8466"+soundFileExtn; } } </script> <body onload="pageLoaded();"> <canvas width="1200" height="480" id="testcanvas" > </canvas> <audio src="/testmusic/8466/8466.wav" controls = "controls" > </audio> <audio src="/testmusic/8466/8466.mp3" controls="controls2"> </audio> <audio controls="controls3"> <!--浏览器会选择第一个支持的格式 音频格式 MINE-type MP3 audio/mpeg Ogg audio/ogg Wav audio/wav --> <source src="/testmusic/8466/8466.wav" type="audio/wav"> <source src="/testmusic/8466/8466.mp3" type="audio/mpeg"> </audio> </body> </html>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。