Javascript: 如何防止页面加载时播放音频？

Question

我正在使用 howler.js 来实现我的音频。我所拥有的非常简单，但问题是音频在页面加载时播放，即使我没有这样指定。这是我拥有的：

var hoverSound = new Howl({
  src: ['../audio/hover.mp3']
 });

function whatEver() {
    if (whatever) {
    hoverSound.play();
   }
 }

这是我第一次这样做，所以我不确定是否有 "stop" 音频之类的。上面的代码在初始页面加载后按预期工作，但刷新页面意味着声音在每次初始加载时播放。我怎样才能防止这种情况发生？谢谢

Answer 1

使用 cookie 存储 'whatever' 变量。

Answer 2

根据你的变量 hoversound 我猜你想在元素悬停时播放声音 (mouseenter) 并在离开时停止 (mouseleave)

var hoverSound = new Howl({
  src: ['https://howlerjs.com/assets/howler.js/examples/player/audio/rave_digger.webm']
});

document.getElementById("player").addEventListener('mouseenter', function() {
  hoverSound.play();
  this.innerHTML = "Leave to Stop";
  this.className += "playing";
  console.log("Playing...");
});
document.getElementById("player").addEventListener('mouseleave', function() {
  hoverSound.stop();
  this.innerHTML = "Hover to Play";
  this.className = "";
  console.log("Stopped...");
});

#player {
  width: 100px;
  background-color: #dd5427;
  padding: 5px;
  color: white;
  font-weight: bold;
}

.playing {
  background-color: #689e0f !important
}

<script src="https://howlerjs.com/assets/howler.js/dist/howler.min.js"></script>
<div id="player">Hover to Play</div>

Javascript: 如何防止页面加载时播放音频？

Javascript: How to prevent audio playing on page load?

javascript

audio

howler.js