网页播放背景音乐实现完整代码
作者：互联网
代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<title></title>
</head>
<body>
<div id="">
你好
</div>
<audio id="music1" controls="controls" autoplay="autoplay" preload id="music1" hidden>
<source src="https://xxx-vue-2d4g055fe160b-1254304076.tcloudbaseapp.com/test/5.mp3" />
</audio>
<!--这里是音乐-->
<button type="button" onclick="play()">播放</button>
<!--这里是一个可以控制背景音乐播放暂停的开关-->
<script type="text/javascript">
var audio = document.getElementById('music1');
// $("#btn").bind("touchstart", function bf() {
// if (audio !== null) {
// //检测播放是否已暂停.audio.paused 在播放器播放时返回false.
// //alert(audio.paused);
// if (audio.paused) {
// audio.play(); //audio.play();// 这个就是播放
// $("#btn").addClass("active")
// } else {
// audio.pause(); // 这个就是暂停
// $("#btn").removeClass("active")
// }
// }
// })
function play(){
console.log('aaaaaa')
alert('播放音乐')
audio.play();
}
</script>
</body>
</html>
点击播放按钮，就可以播放拉。
标签：背景音乐,audio,网页,play,paused,btn,active,播放 来源： https://blog.csdn.net/qq_35713752/article/details/112025122