Javascript 音频播放两次

标签 javascript html audio

我正在构建一个简单的 HTML5/Javascript 游戏,并希望在单击某些内容时播放声音文件。

我有以下内容:

function tileClickListener(e) {
    e.preventDefault();
    console.log('tile clicked');

    var audio = new Audio('sounds/click.wav');
    audio.play();
}

但是,它总是在点击时播放两次。单击事件仅触发一次(使用断点和日志进行测试)。

这个游戏是普通的 JS,没有 jQuery。

我是否遗漏了一些明显的东西?

我发现了与视频相关的其他问题,但没有针对音频的可靠解决方案。

最佳答案

这个幼稚的实现对我来说似乎只播放一次。

Array.from(document.querySelectorAll(".tile")).forEach(function(el){
  el.addEventListener("click", tileClickListener);
});

function tileClickListener(e) {
    e.preventDefault();
    console.log('tile clicked');
    var audio = new Audio('http://www.soundjay.com/button/beep-01a.wav');
    audio.play();
}
.tile{
  height: 100px;
  width: 100px;
  background-color: aliceblue;
  border: solid 1px;
  text-align: center;
  line-height: 100px;
}
<div class="tile">click</div>

关于Javascript 音频播放两次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39004083/

相关文章:

javascript - 在 iframe 中替代 html top.document

android - Android的任何音频降噪技术?

objective-c - 相同的函数,都被执行,一个声音都没有

ubuntu - (双启动)Windows 启动和更新后 Ubuntu 18.04 没有声音

javascript - 仅针对一种表单运行应用程序脚本

javascript - Firebase 权限被拒绝

javascript - 为什么我的 javascript 类实例中的方法看不到属性

html - Bootstrap 弹出窗口太窄

javascript - 具有特殊样式的背景 url

JavaScript 将文本粘贴到带有删除格式的 contenteditable