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

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();
});

密码笔

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