<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="js/jquery-1.10.1.min.js" type="text/javascript"></script> </head> <body> <a class="mscBtn" id="audioBtn" style="cursor:pointer;"></a> <audio id="bgMusic" src="http://tenc.rabbitpre.com/mp3/c5de3e51-7096-4ae5-9af1-50f3eca80f1d" autoplay="autoplay" loop="loop"></audio> <script> var music = document.getElementById("bgMusic"); $("#audioBtn").click(function(){ if(music.paused){//检查视频是否已暂停 true 指示音频/视频已暂停。否则为 false。 music.play();//开始播放 $("#audioBtn").removeClass("pause").addClass("play"); }else{ music.pause();//暂停播放 $("#audioBtn").removeClass("play").addClass("pause"); } }); </script> <style> .pause {background-position: 0 bottom;} .mscBtn {height: 50px; background: #fff url(images/musicBtn.gif) no-repeat; display: block; } </style> </body> </html>