Задать вопрос
  • Как правильно сделать живой поиск?

    dimovich85
    @dimovich85 Куратор тега JavaScript
    https://u-academy.net/
    Для работы с полями ввода есть набор событий:
    1. focus - пользователь поставил фокус на поле ввода.
    2. blur - пользователь убрал фокус с элемента вода.
    3. input - пользователь как-то что-то ввел. Это лучше, чем keyup, ибо не надо проверки keyCode, второе потому что пользователь может в поле вставить текст, что тогда будет с Вашим keyUp? Событие input срабатывает каждый раз, как пользователь сделал изменение в поле ввода.
    4. change - пользователь ввел данные и убрал фокус с поля ввода, то есть это input + blur. Событие происходит не так часто, как input, но и не заставляет проверять value на изменение, как это придется делать при blur.
    5. submit - срабатывает на всей форме, при попытке отправить данные, в данной задаче скорее не интересное событие.

    Для живого поиска логично использовать input, по которому надо отправить текущее value через ajax на сервер и далее ответ куда-то распечатать. Вопрос в другом, ведь событие срабатывает довольно часто, и кто-то печатает так быстро, что и запрос-ответ не успеет, поэтому логично сделать тут debounce с задержкой в приблизительно 300мс, чтобы отправка/получение сработало когда пользователь притормозил в наборе текста или вообще прекратил ввод.
    Ответ написан
    Комментировать