如何在输入字段中按键时无延迟地播放声音?

Question

我的目标是播放类似于手机键盘工作的点击声音文件，但我在这里找到的每种方法似乎都会延迟声音文件重叠，即当我在搜索字段中输入时，声音有时会播放，具体取决于我输入的速度。

我正在使用以下代码：

$("#search") // loop each menu item
.each(function(i) {
if (i != 0) { // only clone if more than one needed
$("#beep")
.clone()
.attr("id", "beep-" + i)
.appendTo($(this).parent()); 
}
$(this).data("beeper", i); // save reference 
})
.keydown(function() {
$("#beep-" + $(this).data("beeper"))[0].play();
});
$("#beep").attr("id", "beep-0"); // get first one into naming convention

但是这种方法会导致有时点击，有时不点击。

Answer 1

如果您的哔哔声很短，并且您pause()并将currentTime重新定位为零......它似乎工作得很好。

$("#search").on("keyup",function(){
//console.log("ok");
$("#beep")[0].pause();
$("#beep")[0].currentTime=0;
$("#beep")[0].play();
});

代码笔

在音频文件的开头暂停和替换是诀窍。否则，如果 和 事件发生在文件结束之前，则文件已经在播放...这给人一种"跳过"事件的印象。