背景:考试系统学生在线考试英语,进入考试页面之后播放英语听力。播放音频的控件用了一个div遮住,不让用户控制。
代码如下:
<style type="text/css"> #cc { float:left; z-index:3; position:absolute; Opacity:0; margin-left:570px; } </style> <div id="cc" style="background-color:red;310px;height:35px;"></div > <audio id="audio" controls=true autoplay=true controls = 'controls' readonly=true> <source src="testEar/avatar/${MP3ID}"/> </audio> <script> audio = document.getElementById("audio"); audio.addEventListener('ended', function () { alert('听力播放结束,祝您取得好成绩!'); audio.controls=false; }, true); </script>
小技巧:
播放音频控件
div悬浮在控件上,遮住控件