使用javascript在网页中播放声音
使用js播放声音需要使用bgsound标签和embed标签,分别用于IE和FF、Chome。
由于播放声音文件即时加载的话第一次会有延迟,所以先要对声音文件进行一次预加载,并设置初始状态为静音:
//浏览器判断对象 browserName = navigator.userAgent.toLowerCase(); browser = { version: (browserName.match(/.+(?:rv|it|ra|ie)[\/: ]([\d.]+)/) || [0, '0'])[1], safari: /webkit/i.test(browserName) && !this.chrome, opera: /opera/i.test(browserName), firefox: /firefox/i.test(browserName), ie: /msie/i.test(browserName) && !/opera/.test(browserName), mozilla: /mozilla/i.test(browserName) && !/(compatible|webkit)/.test(browserName) && !this.chrome, chrome: /chrome/i.test(browserName) && /webkit/i.test(browserName) && /mozilla/i.test(browserName) }; //播放声音对象/*注:如果FF安装了mediawrap插件则能使用bgsound播放*/ playSound = {}; //预加载声音 playSound.init = function (id, media) { if (browser.ie) { document.write('<bgsound id="fjps_bg_' + id + '" volume="-5000" loop="1" src="' + media + '">'); } else { //document.write('<span id="fjps_sp_' + id + '"><bgsound volume="-1000000" id="fjps_bg_' + id + '" loop="1" src="' + media + '"></span>'); document.write('<span id="fjps_sp_' + id + '"><embed width="0" height="0" id="fjps_bg_' + id + '" autostart="1" pluginspage="http://www.microsoft.com/windows/windowsmedia/" playcount="1" volume="-9900" mediawrapchecked="true" src="' + media + '" type="application/x-mplayer2" splayername="BG" tplayername="NewWMP"></span>'); } };
然后建一个play方法用于播放:
//播放声音 playSound.play = function (id, media) { if (browser.ie) { var sound = document.getElementById("fjps_bg_" + id); sound.volume = 1; sound.src = sound.src; } else { var sound = document.getElementById("fjps_sp_" + id); //sound.innerHTML = '<bgsound volume="1" id="fjps_bg_' + id + '" loop="1" src="' + document.getElementById("fjps_bg_" + id).src + '" />'; sound.innerHTML = '<embed width="0" height="0" id="fjps_bg_' + id + '" autostart="1" pluginspage="http://www.microsoft.com/windows/windowsmedia/" playcount="1" volume="0" mediawrapchecked="true" src="' + document.getElementById("fjps_bg_" + id).src + '" type="application/x-mplayer2" splayername="BG" tplayername="NewWMP">'; } };