Rumah  >  Artikel  >  hujung hadapan web  >  Isu keserasian memasukkan fail audio ke dalam HTML dan memainkan fail audio dalam penyemak imbas_HTML/Xhtml_Pengeluaran halaman web

Isu keserasian memasukkan fail audio ke dalam HTML dan memainkan fail audio dalam penyemak imbas_HTML/Xhtml_Pengeluaran halaman web

WBOY
WBOYasal
2016-05-16 16:39:072465semak imbas

Mari kita bincangkan tentang beberapa masalah yang telah saya rumuskan selepas memasukkan fail audio ke dalam html (memainkan fail mp3) melalui ujian tempatan saya:

1 gelung benar=false
Masalah: Ia berfungsi dengan baik pada IE8 (dimainkan melalui pemalam pemain media) tetapi tidak akan dimainkan pada IE6 dan IE7
Pada Firefox, anda perlu memasang QuickTime plug-in to play
Chrome Dengan menukarnya menjadi teg pada html5, ia boleh dimainkan tetapi keseluruhan skrin akan menjadi biru
Opera tidak akan dimainkan secara automatik

2 ;embed type="audio/midi" src ="" autostart=true loop=false>
Masalah: Ia tidak akan dimainkan secara normal pada IE6, IE7, tetapi ia akan dimainkan secara normal pada IE8
Ia akan berfungsi dengan baik pada Firefox
Chrome memerlukan pemalam QuickTime yang kotor untuk dimainkan seperti biasa
Opera tidak akan dimainkan secara automatik

3 : Ia tidak boleh dimainkan pada IE6 dan 7. IE8 akan muncul "Articx tidak digunakan secara normal", dsb. Gesaan perkataan
Normal pada Firefox
Normal pada Chrome
Opera tidak disokong

4.

Salin kod Kodnya adalah seperti berikut:
type="audio/mp3" />

, IE7 tidak disokong, pelayar lain disokong, Opera tidak boleh dimainkan secara automatik

6 Saya mengambil pendekatan berikut (dilaksanakan di bawah jquery):
<🎜. >


Salin kod


Kod adalah seperti berikut:

if(navigator.userAgent.indexOf("Chrome") > ; -1){
Jika Chrome: }else if(navigator.userAgent.indexOf("Firefox")!=-1){ Jika Firefox: }else if(navigator.appName.indexOf("Microsoft Internet Explorer")!=-1 && document .all) {
Jika IE(6 ,7,8):
}else if(navigator.appName.indexOf("Opera")!=-1){
Jika Oprea:
< ;embed src="" type="audio/mpeg" loop="false">
}else{

}


atau





Salin kod

Kodnya adalah seperti berikut:


var ua = navigator.userAgent.toLowerCase(); )/)){
jQuery('#__alert_sound').html('');
} else if(ua.match( /firefox/([d.] )/)){ jQuery('#__alert_sound').html(''); } else if(ua.match(/chrome/([d.] ) /)){
jQuery ('#__alert_sound').html('' );
}
lain jika(ua.match(/opera.([d.] )/)){
jQuery('#__alert_sound').html( '<bgsounds src="/sounds/alert/1.mp3">&lt ;/noembed>'); <br>} <br>lain jika(ua.match(/version/([d.] ).*safari/)){ <br>jQuery('#__alert_sound').html( '<audio src="/ sounds/alert/1.mp3" type="audio/mp3" autoplay="autoplay" hidden="true"></audio>'); <br>} <br> lain { <br>jQuery(' #__alert_sound').html('<embed src="/sounds/alert/1.mp3" type="audio/mp3" hidden="true" loop="false" mastersound> </embed>'); <br>} <br><br> </div></div><div class="nphpQianMsg"><div class="clear"></div></div><div class="nphpQianSheng"><span>Kenyataan:</span><div>Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn</div></div></div><div class="nphpSytBox"><span>Artikel sebelumnya:<a class="dBlack" title="Paparkan dan sembunyikan elemen HTML melalui paparan atau visibility_HTML/Xhtml_Web page production" href="http://m.php.cn/ms/faq/11442.html">Paparkan dan sembunyikan elemen HTML melalui paparan atau visibility_HTML/Xhtml_Web page production</a></span><span>Artikel seterusnya:<a class="dBlack" title="Paparkan dan sembunyikan elemen HTML melalui paparan atau visibility_HTML/Xhtml_Web page production" href="http://m.php.cn/ms/faq/11447.html">Paparkan dan sembunyikan elemen HTML melalui paparan atau visibility_HTML/Xhtml_Web page production</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>Artikel berkaitan</h2><em><a href="http://m.php.cn/ms/article.html" class="bBlack"><i>Lihat lagi</i><b></b></a></em><div class="clear"></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="fluid" data-ad-layout-key="-6t+ed+2i-1n-4w" data-ad-client="ca-pub-5902227090019525" data-ad-slot="8966999616"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><ul class="nphpXgwzList"><li><b></b><a href="http://m.php.cn/ms/faq/348757.html" title="Html小知识总结" class="aBlack">Html小知识总结</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ms/faq/348804.html" title="如何快速学习HTML" class="aBlack">如何快速学习HTML</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ms/faq/348873.html" title="html xhtml xml的区别" class="aBlack">html xhtml xml的区别</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ms/faq/348884.html" title="src与href属性的区别" class="aBlack">src与href属性的区别</a><div class="clear"></div></li><li><b></b><a href="http://m.php.cn/ms/faq/348902.html" title="关于HTML5和CSS替换使用" class="aBlack">关于HTML5和CSS替换使用</a><div class="clear"></div></li></ul></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-5902227090019525" data-ad-slot="5027754603"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><footer><div class="footer"><div class="footertop"><img src="/static/imghwm/logo.png" alt=""><p>Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!</p></div><div class="footermid"><a href="http://m.php.cn/ms/about/us.html">Tentang kita</a><a href="http://m.php.cn/ms/about/disclaimer.html">Penafian</a><a href="http://m.php.cn/ms/update/article_0_1.html">Sitemap</a></div><div class="footerbottom"><p> © php.cn All rights reserved </p></div></div></footer><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) { var _times = times || -1, //100次 _interval = interval || 20, //20毫秒每次 _self = this, _selector = this.selector, //选择器 _iIntervalID; //定时器id if( this.length ){ //如果已经获取到了,就直接执行函数 func && func.call(this); } else { _iIntervalID = setInterval(function() { if(!_times) { //是0就退出 clearInterval(_iIntervalID); } _times <= 0 || _times--; //如果是正数就 -- _self = $(_selector); //再次选择 if( _self.length ) { //判断是否取到 func && func.call(_self); clearInterval(_iIntervalID); } }, _interval); } return this; } $("table.syntaxhighlighter").wait(function() { $('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>"); }); $(document).on("click", ".cnblogs_code_footer",function(){ $(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide(); }); $('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}}); </script></body></html>