我创建了一个小型的基于Web的游戏，必须有一些背景音乐播放页面。 这些网页应与大多数桌面浏览器，包括IE8（但我们可以忽略移动浏览器）兼容。
当然，我想允许用户停止音乐。 这是它得到棘手。
这是我目前使用（使用jQuery）：
<audio id="main_audio" autoplay="autoplay" preload="auto" loop="loop">
<source src="sounds/bgmusic.mp3" type="audio/mpeg" />
<source src="sounds/bgmusic.ogg" type="audio/ogg" />
<embed hidden="true" autostart="true" loop="true" src="sounds/bgmusic.mp3" />
</audio>
<div id="controls" class="controls">
<a id="playpause" class="play">Play/Pause</a>
</div>
<script>
function isPlaying(audio) {return !audio.paused;}
var a = document.getElementById('main_audio');
$('#playpause').on('click', function() {
if (isPlaying(a)) {
a.pause();
} else {
a.play();
}
});
</script>
这在所有的浏览器工作正常，但IE浏览器。 （我在Windows XP上的IE8所以测试目前。）在IE8，音频开始播放（这是好的），但因此不可能停止音乐的控制不会做任何事情（并重新启动）。
我怎样才能让IE浏览器这个脚本的工作吗？ 换句话说，与嵌入标签（但只能在IE）互动？
尝试下一编码：
<audio id="main_audio" autoplay="autoplay" preload="auto" loop="loop">
<source src="sounds/bgmusic.mp3" type="audio/mpeg" />
<source src="sounds/bgmusic.ogg" type="audio/ogg" />
<embed id="main_audio_ie8" hidden="true" autostart="true" loop="true" src="sounds/bgmusic.mp3" />
</audio>
<div id="controls" class="controls">
<a id="playpause" class="play">Play/Pause</a>
</div>
<script>
var isPlaying = function(audio) {return !audio.paused;}
var a = document.getElementById('main_audio');
if(!(a.play instanceof Function)){
a = document.getElementById('main_audio_ie8');
isPlaying = function(audio) {return audio.playState==2;}
}
$('#playpause').on('click', function() {
if (isPlaying(a)) {
a.pause();
} else {
a.play();
}
});
</script>
另一种变型（代码必须工作，如果WMPlayer.OCX上系统存在;检查在Win2k + IE6SP1 + WMP7，WINXP + IE6SP1 + WMP9，WINXP + IE8 + WMP11）：
<audio id="main_audio" autoplay="autoplay" preload="auto" loop="loop" volume="1.0">
<source src="sounds/bgmusic.mp3" type="audio/mpeg" />
<source src="sounds/bgmusic.ogg" type="audio/ogg" />
<object id="main_audio_ie8" classid="clsid:6BF52A52-394A-11d3-B153-00C04F79FAA6" style="display:none;">
<param name="URL" value="sounds/bgmusic.mp3" />
<param name="uiMode" value="invisible" />
<param name="autoStart" value="true" />
<param name="volume" value="100" />
<param name="playCount" value="2147483647" /> <!-- (Int32) 2^31-1==2147483647 - maximum allowed count (for 1 second length audio is equals to 68+ years) -->
</object>
</audio>
<div id="controls" class="controls">
<a id="playpause" class="play">Play/Pause</a>
</div>
<script type='text/javascript'>
window.onload=function(){
var isPlaying,a=document.getElementById('main_audio');
if(a.play instanceof Function)isPlaying=function(audio){return !audio.paused;};
else{
a=document.getElementById('main_audio_ie8');
isPlaying=function(audio){return audio.playState==3;};
a.play=function(){this.controls.play();}
a.pause=function(){this.controls.pause();}
}
document.getElementById('playpause').onclick=function() {
if (isPlaying(a)) {
a.pause();
} else {
a.play();
}
};
};
</script>
