jQuery wtyczka tagowania autouzupełniania jak tagi wejściowe StackOverflow? [Zamknięte]

522

Jakie rozwiązania zapewniają to samo automatyczne uzupełnianie, którego używa SO do wprowadzania tagów?

Istnieją wtyczki, które mogą obsługiwać jedno słowo, ale nie widziałem żadnego, który obsługuje wiele słów.

jquery autocomplete tags Joe Phillips
źródło
Głosowanie w celu zamknięcia jako narzędzie rec.
Ciro Santilli 30 冠状 病 六四 事件 法轮功
1
Stworzyłem najlepszy - github.com/yairEO/tagify
vsync,
@vsync Dodał go do listy w pierwszej odpowiedzi. Niestety nie można połączyć bezpośrednio z codepen.io z powodu braku kodu w odpowiedzi
Joe Phillips,
@JoePhilllips - być może przyjmie skrócone adresy URL Google
vsync
@JoePhilllips - Moja wtyczka jest lepsza niż najlepsza na górze listy i zasługuje na to, aby być na szczycie i mam na to dobre punkty sprzedaży. obecnie najwyższy na liście jest nadęty (x4 niż mój), używa dodatkowego elementu wejściowego (zły w przypadku serializacji formularza) i nie obsługuje przecinków ani wklejania tagów. oferuje pewne funkcje, które są ładne, ale niepotrzebne w większości przypadków. autocompletepowinien być używany desperacko IMHO
vsync 13.10.16

Odpowiedzi:

763

W kolejności działania dostępne dema / przykłady i prostota:

Związane z:

Dmitriy Nesteryuk
źródło
W IE9 wyświetla komunikat „Błąd linii: 18: Obiekt nie obsługuje właściwości ani metody„ tagit ””
Raghav
2
Każdy, kto szuka najbardziej aktualnej wersji, dokumentacji i obszerniejszych przykładów tej niesamowitej wtyczki, powinien przejść tutaj i odszukać
Crisman
1
aktualizacja: myślę, że magicsuggest jest teraz najlepszą opcją.
ssj
8
tag-jest przereklamowany. Wymaganie jquery dla prostego systemu tagów jest zbyt duże, ale wymaganie również jQuery UI i jquery UI CSS jest po prostu szalone. Nie jest tego warte.
Alvaro
1
@scniro Skończyło się na użyciu jquery.tagsinput, ponieważ nie mam nic przeciwko użyciu jQuery, który jest już używany w moim projekcie. Pomyślałem, że szaleństwem jest poprosić o jquery UI i CSS.
Alvaro,
62

Bootstrap: Jeśli używasz Bootstrap. To jest naprawdę dobre: Select2

Również TokenInput jest interesujący. Po pierwsze, nie zależy od jQuery-UI, po drugie jego konfiguracja jest bardzo płynna.

Jedyny problem, jaki miałem, nie obsługuje natywnego tagowania. Tak więc muszę zwrócić ciąg zapytania z powrotem do klienta w ramach odpowiedzi JSON.

Jak wspomniano w komentarzu @culithay, TokenInput obsługuje wiele funkcji dostosowywania. Podkreśl niektóre funkcje, których inne nie mają:

  • tokenLimit: maksymalna liczba wyników dozwolona przez użytkownika. Użyj null, aby zezwolić na nieograniczone możliwości wyboru
  • minChars: minimalna liczba znaków, które użytkownik musi wprowadzić przed rozpoczęciem wyszukiwania.
  • queryParam: nazwa parametru zapytania, który ma zawierać wyszukiwany termin po stronie serwera

Dziękuję za wkład.

Nishant
źródło
3
TokenInput wygląda dokładnie tak, jak tego szukałem: użytkownik wpisuje coś, wykonuje wyszukiwanie na serwerze, użytkownik może wybrać szukany element, spłukać i powtórzyć.
Mala
1
TokenInput obsługuje wiele funkcji, które można dostosować. Podkreślam niektóre funkcje, których inni nie mają. - tokenLimit: maksymalna liczba wyników dozwolona przez użytkownika. Użyj null, aby zezwolić na nieograniczone możliwości wyboru - minChars: minimalna liczba znaków, którą użytkownik musi wprowadzić przed rozpoczęciem wyszukiwania. - queryParam: nazwa parametru zapytania, który ma zawierać wyszukiwany termin po stronie serwera
dniu
1
@culithay dodał do odpowiedzi
Nishant
Jak dodać nowe darmowe tagi: stackoverflow.com/questions/28656977/... Hard :-(
Ciro Santilli 郝海东 冠状 病 六四 事件 法轮功
Dobry. Brak obsługi bezpłatnego tagowania nie jest dużym problemem, ponieważ można go łatwo rozwiązać.
RationalRabbit
9

To pierwotnie stanowiło odpowiedź na dodatkowe pytanie dotyczące mądrości pobierania jQuery w porównaniu z dostępem do niego przez CDN, który już nie jest obecny ...

Aby odpowiedzieć na pytanie o Google. Przeszedłem do uzyskiwania dostępu do JQuery i większości innych tego rodzaju bibliotek za pośrednictwem odpowiedniego CDN na moich stronach.

Im więcej osób to robi, tym bardziej prawdopodobne jest, że będzie ono buforowane na komputerach użytkowników, więc mój głos jest dobry.

W ciągu pięciu lat, które po raz pierwszy zaoferowałem, stało się to powszechną mądrością.

juliański
źródło
3
Rozwijamy to również jako część naszych domyślnych szablonów. Google może udostępniać ten kod spakowany i wychodzić z CDN szybciej niż my, a jeśli nawet istnieje 2% szansy na to, że użytkownik ma ten bufor, to jest lepsze niż brak szansy.
Tom
27
Jak to jest odpowiedź na pierwotne pytanie?
Derek
3
Ostatnia część „Ponadto…” dotyczy tego, czy linkowanie do wersji Google jest dobrym czy złym pomysłem, a moja odpowiedź brzmi: jest to coraz lepszy pomysł.
Julian
@Derek Nie sądzę, że miałem inne akceptowalne odpowiedzi, kiedy pierwotnie o to pytałem. Od tego czasu to się zmieniło.
Joe Phillips
1

Właśnie otworzyliśmy tę wtyczkę jquery Github: tactivos / jquery-sew .

użytkownik1880508
źródło
1
Chociaż ten link może odpowiedzieć na pytanie, lepiej dołączyć tutaj istotne części odpowiedzi i podać link w celach informacyjnych. Odpowiedzi zawierające tylko łącze mogą stać się nieprawidłowe (i negatywnie ocenione), jeśli zmieni się połączona strona. Zobacz, jak odpowiedzieć, dlaczego jest to ważne.
bytebuster
3
Strona demonstracyjna nie działa.
Edward Olamisan,