_.debounce функция странно себя ведет на нескольких входах

У меня есть 4 входа на странице и такой код

$('input').on('keyup', _.debounce(function(){
  console.log('Keyup fired')
}, 10000))

Итак, в $('input') у меня есть коллекция из 4 входов. Когда я начинаю быстро вводить все 4 ввода, через 10 секунд после того, как я получаю только одно «Keyup fired» в консоли.

Кажется, что каждый вход выполняет одну и ту же функцию. Но, на мой взгляд, каждый вход должен иметь свой собственный экземпляр функции _debounce.

Почему я ошибаюсь? На мой взгляд, почему я пишу COLLECTION.on(event,fn). Jquery должен отображать 4 входа и назначать каждому результат вызова _.debounce(). Таким образом, каждый вход будет иметь собственный экземпляр функции debounce. благодарю вас


javascript jquery lodash debounce
person Mihey Mik    schedule 29.05.2017    source источник

Ответы (1)


arrow_upward
4
arrow_downward

Кажется, что каждый вход выполняет одну и ту же функцию.

Конечно, потому что вы предоставили один обработчик событий для всех ваших входных данных.

Если вам нужны отдельные обработчики, вам нужно будет привязать событие для каждого входа отдельно:

$('input').each(function() {
  $(this).on('keyup', _.debounce(function() {
    console.log('Keyup fired')
  }, 10000))
})
person dfsq    schedule 29.05.2017
comment
спасибо.. просто мне показалось странным, что на каждый элемент коллекции назначена одна и та же функция... я думал - каждый раз надо назначать новый _debounce - person Mihey Mik; 29.05.2017
comment
новый _.debounce, конечно, будет уникальным, но в вашем случае вы вызвали _.debounce только один раз, поэтому он использует ту же функцию. - person dfsq; 29.05.2017
comment
Dfsq, я думал, должно работать как в случае с .map(() =› ), функция вызывается для каждого элемента массива. Но здесь .on, видимо, реализован иначе - здесь он вызывается только один раз... - person Mihey Mik; 29.05.2017
comment
Он вызывается только один раз, потому что вы вызываете .on только один раз. _.debounce возвращает новую функцию, которая будет использоваться как обработчик событий. Итак, у вас есть $('input').on('keyup', handler). Здесь обработчик будет общим для всех входов. Это ваша ситуация. - person dfsq; 29.05.2017