JS 控制 audio 标签 播放/暂停 音乐

<script type="text/javascript">
    window.onload = function(){
        /*解决不同浏览器不能播放的情况*/
        // function toggleSound() {
        //      if (audio.paused) { //判读是否播放
        //           audio.play(); //没有就播放
        //      }
  //          }
          // toggleSound();
          (function(){
                var audio = document.getElementById("audio"); 
                var musiIocn = document.getElementById("music-iocn");
                var off = document.getElementById("off");

                off.onclick = function(){
                    if(off.className == "paly"){  //如果当前播放
                        audio.pause(); //停止（暂停）
                        off.className="stop"; //暂停
                        musiIocn.src = "img/music130.png";  //暂停图片
                        musiIocn.className = " "; //取消图片360旋转CSS3动画
                    }else if(off.className == "stop"){  //如果当前暂停
                        audio.play();  //开始播放
                        off.className="paly";  //开始播放
                        musiIocn.src = "img/music131.png"; //播放图片
                        musiIocn.className = "rota";  //追加图片360旋转CSS3动画
                    } 
               }
          })();
    }
</script> 

</head>
<body>
<div class="paly" id="off">
    <img src="img/music131.png" class="rota" id="music-iocn" alt="旋转">
</div>
<audio id="audio" src="img/mp3.mp3"  loop autoplay></audio>
</body>
</html>
版权声明：本文为feifanzhuli原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接和本声明。