html文件    

  <div>
        <audio id="music" style="display:none" preload="auto" controls="">
            <source src="{$music}" type="audio/mpeg">
        </audio>
        <img src="{img_path}mb-icon-t.png" id='mbtn' alt=""  style="width:50px;height:50px;">
    </div>

js控制播放暂停

<script>
    $(function(){
        $('#mbtn').click(function()
        {
            var img=document.getElementById("mbtn");
            if(img.src.indexOf("{img_path}mb-icon-t.png")>-1)
            {
                $('#music').get(0).play();
                img.src="{img_path}mb-icon-b.png";
            }
            else
            {
                img.src="{img_path}mb-icon-t.png";
                $('#music').get(0).pause();
                $('#music').get(0).currentTime = 0;
            }
        });
    });
</script>

h5 audio标签的使用

    <div style="text-align:center;margin:auto;display: block;clear:both;padding:10px;">
 
        <audio src="{$music}" controls="controls" loop="loop" autoplay="autoplay" ></audio>
 
    </div>

发表评论

邮箱地址不会被公开。 必填项已用*标注