在html中插入音頻文件在瀏覽器中播放音頻文件的兼容性問題

字號:


    下面談?wù)劚救嗽趆tml中插入音頻文件,經(jīng)過我的本地測試總結(jié)的一些問題(播放mp3文件):
    1、<embed type=audio/mp3 src= autostart=true loop=false></embed>
    問題:ie8上正常(通過media player插件來播放)但在ie6和ie7上不會播放
    firefox上要安裝quicktime插件才能播放
    chrome通過將其轉(zhuǎn)化成html5上的<vidio>標簽播放,能播放但會使整個屏幕藍屏
    opera不會自動播放
    2、<embed type=audio/midi src= autostart=true loop=false></embed>
    問題:ie6,ie7上不會正常播放,ie8正常
    firefox上正常
    chrome上要求骯臟quicktime插件才能正常播放
    opera不會自動播放
    3、<object data= />
    問題:在ie6,7上不能播放,ie8會彈出“非正常使用的articx”等字樣的提示
    firefox上正常
    chrome上正常
    opera不支持
    4、<audio src= type=audio/mp3 />
    問題:html5標簽 僅chrome支持
    5、
    代碼如下:
    <audio autoplay>
    <source src= type=audio/mp3 />
    <embed src= type=audio/mp3/>
    </audio>
    問題:ie6,ie7不支持,其余瀏覽器均支持,opera不能自動播放
    6、<embed src=><noembed><bgsound src=></noembed>
    問題:ie6,ie7均不支持,其余瀏覽器均支持,opera不能自動播放
    綜合以上本人采取了一下方式(jquery下執(zhí)行):
    代碼如下:
    if(navigator.useragent.indexof(chrome) > -1){
    如果是chrome:
    <audio src= type=audio/mp3 autoplay=”autoplay” hidden=true></audio>
    }else if(navigator.useragent.indexof(firefox)!=-1){
    如果是firefox:
    <embed src= type=audio/mp3 hidden=true loop=false mastersound></embed>
    }else if(navigator.appname.indexof(microsoft internet explorer)!=-1 && document.all){
    如果是ie(6,7,8):
    <object classid=clsid:22d6f312-b0f6-11d0-94ab-0080c74c7e95><param name=autostart value=1 /><param name=src value= /></object>
    }else if(navigator.appname.indexof(opera)!=-1){
    如果是oprea:
    <embed src= type=audio/mpeg loop=false></embed>
    }else{
    <embed src= type=audio/mp3 hidden=true loop=false mastersound></embed>
    }
    或
    代碼如下:
    var ua = navigator.useragent.tolowercase();
    if(ua.match(/msie ([\d.]+)/)){
    jquery('#__alert_sound').html('<object classid=clsid:22d6f312-b0f6-11d0-94ab-0080c74c7e95><param name=autostart value=1 /><param name=src value=/sounds/alert/1.mp3 /></object>');
    }
    else if(ua.match(/firefox\/([\d.]+)/)){
    jquery('#__alert_sound').html('<embed src=/sounds/alert/1.mp3 type=audio/mp3 hidden=true loop=false mastersound></embed>');
    }
    else if(ua.match(/chrome\/([\d.]+)/)){
    jquery('#__alert_sound').html('<audio src=/sounds/alert/1.mp3 type=audio/mp3 autoplay=”autoplay” hidden=true></audio>');
    }
    else if(ua.match(/opera.([\d.]+)/)){
    jquery('#__alert_sound').html('<embed src=/sounds/alert/1.mp3 hidden=true loop=false><noembed><bgsounds src=/sounds/alert/1.mp3></noembed>');
    }
    else if(ua.match(/version\/([\d.]+).*safari/)){
    jquery('#__alert_sound').html('<audio src=/sounds/alert/1.mp3 type=audio/mp3 autoplay=”autoplay” hidden=true></audio>');
    }
    else {
    jquery('#__alert_sound').html('<embed src=/sounds/alert/1.mp3 type=audio/mp3 hidden=true loop=false mastersound></embed>');
    }