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

有没有办法将this问题的建议应用到我的问题中？

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

您只需要以不同的方式处理按键事件，您可以在其中查看事件属性。

试试这个......

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

有条件的去抖动，取决于event.keyCode

3 个答案: