audio最简单原始的播放、暂停、停止、静音、音量大小控制的功能,注意某些浏览器会有权限无法自动播放噢(video也会如此)
<!doctype html><html><head><meta charset="utf-8"><title>audio声音控制</title><script type="text/javascript">//注意某些浏览器有权限无法自动播放//声音控制var my_audio={ obj:null, is_auto_play:false, is_loop:false, set:function(a){ var self=this; self.obj=new Audio(a.url); if(a.auto){ self.is_auto_play=true; self.play(); } if(a.loop){ self.is_loop=true; } }, play:function(){ var self=this; self.obj.play(); if(self.is_loop){ self.obj.onended = function() { self.play(); }; } }, pause:function(){ var self=this; self.obj.pause(); }, stop:function(){ var self=this; self.obj.pause(); self.obj.currentTime = 0.0; }, muted:function(){ var self=this; self.obj.muted ? self.obj.muted = false : self.obj.muted = true; }, volume_add:function(){ var self=this; self.obj.volume = self.obj.volume + 0.1; }, volume_minus:function(){ var self=this; self.obj.volume = self.obj.volume - 0.1; }, init:function(a){ var c = function(s) { var r={}; for (var k in s) { r[k] = typeof s[k]==="object" ? c(s[k]) : s[k]; } return r; } var self = c(my_audio); self.set(a); return self; }}var audio_bg=my_audio.init({url:"video/bg.mp3",auto:true});var audio_gift=my_audio.init({url:"video/gift.mp3",loop:true});var audio_bomb=my_audio.init({url:"video/bomb.mp3"});</script></head><body><br><br><br><br><br><a href="javascript:audio_bg.play();">播放背景</a><a href="javascript:audio_bg.pause();">暂停背景</a><a href="javascript:audio_bg.stop();">停止背景</a><a href="javascript:audio_bg.muted();">静音背景</a><a href="javascript:audio_bg.volume_add();">增加背景音</a><a href="javascript:audio_bg.volume_minus();">减少背景音</a><br><br><br><br><br><a href="javascript:audio_gift.play();">播放gift</a><a href="javascript:audio_gift.pause();">暂停gift</a><a href="javascript:audio_gift.stop();">停止gift</a><a href="javascript:audio_gift.muted();">静音gift</a><a href="javascript:audio_gift.volume_add();">增加gift音</a><a href="javascript:audio_gift.volume_minus();">减少gift音</a><br><br><br><br><br><a href="javascript:audio_bomb.play();">播放bomb</a><a href="javascript:audio_bomb.pause();">暂停bomb</a><a href="javascript:audio_bomb.stop();">停止bomb</a><a href="javascript:audio_bomb.muted();">静音bomb</a><a href="javascript:audio_bomb.volume_add();">增加bomb音</a><a href="javascript:audio_bomb.volume_minus();">减少bomb音</a></body></html>
原标题:audio 基本功能实现(audio停止播放,audio如何静音,audio音量控制等)
关键词: