Фильтр поиска по карте Javascript Страница обзора карты

В настоящее время я создаю обзорную страницу с большим количеством карточек, которые содержат такие данные, как название маршрута, количество маршрутов, начальная точка и дата. Теперь я пытаюсь создать фильтр с помощью javascript, в котором пользователь сможет отфильтровать название маршрута, количество маршрутов, начальную точку и дату, чтобы пользователь мог искать конкретную карту.

В настоящее время у меня есть 6 карточек с данными, и когда я ввожу данные в поле ввода поиска, он просто удаляет первые 4 карточки и показывает последние 2.

  • Я использовал некоторые ненужные имена классов, такие как route__text, это было сделано только для того, чтобы попытаться исправить мой фильтр поиска.

Мой код:

Помощь будет очень признательна

Код ниже работает... Ваш код был очень запутанным, чтобы редактировать и указывать на ошибки, но в целом вам стоит обратить внимание на пару вещей:

  1. Обратите внимание на разницу между HTML-коллекциями, массивами и NodeLists
  2. .
  3. Избегайте вложенных циклов for, поскольку они запутанны и трудны для понимания. В случае, если вам действительно необходимо его использовать, не используйте одно и то же имя переменной (i в вашем случае), так как это вносит путаницу в интерпретатор и других программистов.
  4. keyup вызывать ненужные search вызовы событий, когда не было сделано никакого ввода (т.е. нажатия shift или caps).
Вернуться на верх