<div class="pb-page-music">
    <span class="icon rotate">
        <i class="iconfont">&#xe61a;</i>
    </span>
    <audio id="pageBackgroundMusic" preload="auto" src="{{\TechSoft\Laravel\Assets\AssetsUtil::fix($backgroundMusic)}}"></audio>
</div>
<script>
    (function () {
        var $icon = $('.pb-page-music .icon');
        var audio = document.getElementById('pageBackgroundMusic');
        document.addEventListener('DOMContentLoaded', function () {
            audio.play();
            document.addEventListener("WeixinJSBridgeReady", function () {
                audio.play();
            }, false);
        });
        $icon.on('click',function () {
            $icon.toggleClass('rotate');
            if($icon.hasClass('rotate')){
                audio.play();
            }else{
                audio.pause();
            }
        });
    })();
</script>