Dynamiczne wyszukiwanie w inpucie

pytanie zadane 16 lipca 2018 w JavaScript przez Yashe Dyskutant (7,720 p.)

Witam serdecznie,

Od około tygodnia tworzę "dynamiczne" wyszukiwanie dla swojego projektu. Powiedzmy, że mamy pule 100 postaci, każdy swoją własną nazwę. Osoba wpisuje w pole "a" i podświetlają mu się postacie z tą literą (reszta jest wygaszona). Później "ab" no i wyświetla mu się jedna postać. Wszystko można by rzecz "działa". Niestety nie umiem sobie poradzić z.. a w sumie tutaj link: https://jsfiddle.net/Yashe/x1kwy20r/44/

Jedyne co stworzyłem, to te "mruganie", aby każdy mógł zrozumieć o co chodzi. Tutaj również obrazek z realnego wyglądu strony.

Kolejne:

Wszystko działa poprzez dodawanie i usuwanie klasy. Totalnie nie wiem jaki warunek powinienem dodać.. oraz jak usunąć klasę "backlight", gdy return funkcji check jest już inny.

2 odpowiedzi

odpowiedź 17 lipca 2018 przez Tomek Sochacki Ekspert (227,510 p.)
wybrane 17 lipca 2018 przez Yashe

Najlepsza

Zobacz na syzbko taki przykład na codepen:

https://codepen.io/anon/pen/qyZGxv

Nie analizowałem dokładnie Twojego kodu bo nie mam teraz na to czasu więc wolałem szybko napisać to po swojemu. Kod ten jest daleki od ideału ale chodzi tylko o sam pomysł na takie dynamicznie wyróżnianie określonych elementów.

Zobacz czy o taki efekt Ci chodzi?

komentarz 17 lipca 2018 przez Yashe Dyskutant (7,720 p.)

Tak dokładnie o to chodziło.. lecz jest mały problem, gdyż osoba wchodząca na stronae powinna widzieć wszystkie postacie "aktywne", a dopiero po wprowadzenia czegoś do input'a podświetlanie zgadzających się i "przygaszenie" nieprawidłowych. Spróbuje to jakoś rozwiązać dodając nowe klasy

komentarz 17 lipca 2018 przez Tomek Sochacki Ekspert (227,510 p.)

to już jest kwestia odpowiedniej modyfikacji np. warunków dla metody toggle i odpowiedniego ostylowania, ja chciałem pokazać ideę rozwiązania problemu a takie szczegóły to już sobie sam poustawiaj jak chcesz.