Wprowadź dane wejściowe wyszukiwania, aby filtrować listę Jquery
Hej, próbuję stworzyć pole wyszukiwania, które będzie filtrować lub pokazywać / ukrywać (co jest najlepsze) elementy listy oparte na tym, co użytkownik wpisał i kliknął przycisk wyszukiwania. Nie mam pojęcia, jak to zrobić. wszystko, co próbowałem, nie działa niestety i nie jestem pewien najlepszego podejścia do tego, jak używam show i hide lub czy jest coś lepszego?
To jest mój HTML:
<html>
<head>
</head>
<body>
<label for="filter">Filter</label>
<input type="text" name="filter" value="" id="filter" />
<a id="addtag" href="#">Search</a>
<ul>
<li id="Hero1">Superman</li>
<li id="Hero2">Batman</li>
<li id="Hero3">Spiderman</li>
<li id="Hero4">Iron Man</li>
<li id="Hero5">The Hulk</li>
</ul>
</body>
</html>
Jeśli więc ktoś wpisze „Supermana” i kliknie przycisk wyszukiwania, zostanie wyświetlony tylko element listy Superman.
Każda pomoc na ten temat byłaby świetna. Dzięki.