使用jquery控制修改audio的src属性,点击按钮播放不同

思路是，每次点击不同按钮，创建一个audio标签，并且给出src值，并且播放
1、首先准备一个放audio标签的容器

<div class="audiopalyer"></div>

2、然后准备两个按钮，或者什么，我这里是div

<div  class="clickitem" audio="1.mp3">111</div>
<div  class="clickitem" audio="2.mp3">222</div>

3、然后用jquery控制，当然别忘了引入jquery,按照这个思路也可以用原生写哦

$(".clickitem").click(function(){
        //首先置空容器，因为除了第一次点击总是有audio标签的        
        $(".audiopalyer").html("")
        //来一个audio内容，看好这里已经给src赋值了
        var aud = $('<audio id="player"  src="' + $(this).attr("audio") + '" hidden></audio>')
        //放到容器里区
        $(".audiopalyer").html(aud)
        //获取当前audio
        var audio = $("#player")[0];
        //局部load()一下
        aud.load();
        audio.play();
    });

当然也可以直接默认播放，

$(".clickitem").click(function(){
        //首先置空容器，因为除了第一次点击总是有audio标签的        
        $(".audiopalyer").html("")
        //来一个audio内容，看好这里已经给src赋值了
        var aud = $('<audio id="player"  src="' + $(this).attr("audio") + '" autoplay hidden></audio>')
        //放到容器里区
        $(".audiopalyer").html(aud)
    });