有条件的反跳，具体取决于event.keyCode

Question

我有一个搜索字段，它接受用户输入并使用去抖动的事件侦听器发出ajax请求。

的HTML：

<input id="search" type="text"></input>

javascript：

function makeRequest() {
  // make ajax request, do things with the information
}

$('#search').on('keypress', _.debounce(makeRequest, 200));

我需要事件监听器不要在上下箭头上使用去抖动的ajax函数，即event.keyCode === 38或event.keyCode === 40

有没有办法将这个问题的建议应用于我的问题？

Answer 1

确保保存结果并仅调用函数，在每次按键时创建函数都会产生不必要的开销。

var debounced = _.debounce(makeRequest, 200);
$('#search').on('keypress', function(event) {
    // just exit if it's an up or down arrow
    if (event.which === 38 || event.which === 40) return;
    debounced();
});

Answer 2

您只需要以其他方式处理keypress事件，即可在其中看到事件属性。

试试这个...

$('#search').on('keypress', function(event) {

    // just exit if it's an up or down arrow
    if (event.which === 38 || event.which === 40) return;

    // do whatever you want here, knowing that up or down was not pressed.

});

由于您的问题与您要使用的debounce方法无关，因此我从示例中删除了该方法，因此您可以专注于所要解决的特定问题。

Answer 3

问题在于，事件侦听器的回调需要调用从_.debounce返回的函数，而不仅仅是创建已去抖动的函数。

$('#search').on('keypress', function(event) {
  if (event.which === 38 || event.which === 40) {
    // do other things
    return;
  }
  _.debounce(makeRequest, 200)();
});