Question

适用于单个文件：

<button id="btn">Play</button>
<script>
 var btn = new Howl({urls: ['http://www.javascriptoo.com/application/html/btn.wav']})
document.getElementById('btn').onclick=function(){btn.play()}
</script>

但我需要播放多个文件：

<button id="btn2">Play</button>
<button id="btn3">Play</button>
<button id="btn23">Play</button>

解决问题是否容易？

Answer 1

将不同的声音组合成音频精灵（推荐方法）：

var btns = new Howl({
  urls: ['http://www.javascriptoo.com/application/html/btn.wav'],
  sprite: {
    btn1: [0, 1000],
    btn2: [2000, 3000],
    btn3: [4000, 5000]
  }
});

或者，您可以为每个按钮设置一个新的Howl：

var btn1 = new Howl({
  urls: ['http://www.javascriptoo.com/application/html/btn1.wav']
});
document.getElementById('btn1').onclick = function(){
  btn1.play();
};

var btn2 = new Howl({
  urls: ['http://www.javascriptoo.com/application/html/btn2.wav']
});
document.getElementById('btn2').onclick = function(){
  btn2.play();
};

var btn3 = new Howl({
  urls: ['http://www.javascriptoo.com/application/html/btn3.wav']
});
document.getElementById('btn3').onclick = function(){
  btn3.play();
};

howler.js用于多个音频文件

1 个答案: