Multi.js - przyjazne dla użytkownika pole wyboru zbudowane na zwykłym JavaScript
Wybierz menu są prymitywne, ale działają. To samo dotyczy wszystkich typowych danych wejściowych, takich jak pola wyboru i przyciski radiowe.
Tworzenie własnych formularzy jest łatwe, ale odbudowywanie elementów interfejsu od podstaw może być trudne. Dlatego Multi.js jest tak cenną wtyczką zastępując domyślne pola wyboru.
Z Multi.js, ty dać odwiedzającym listę przedmiotów do wyboru z funkcją wielokrotnego wyboru wbudowaną w formularz. W ten sposób użytkownicy mogą kliknij wiele elementów bez polegania na polach wyboru.
Ten skrypt nawet obsługuje funkcję wyszukiwania, więc użytkownicy mogą wyszukiwać przedmioty, jeśli lista jest szczególnie długa.
Menu uważam również za dość intuicyjne, więc to nie wymaga wiele wyjaśnień. Kliknij dowolny element po lewej stronie, aby dodać go do prawej kolumny (lub “wybrany” przedmiotów). Następnie kliknij elementy w prawej kolumnie, aby je usunąć.
Wszystko działa na waniliowym JavaScript, w tym funkcję wyszukiwania, więc nie potrzebujesz żadnych zależności. Mimo, że obsługuje jQuery jeśli Twoja witryna korzysta z tej biblioteki.
Wszystko, czego potrzebujesz, to plik Multi.js i arkusz stylów CSS. Następnie po prostu Stwórz element i wyceluj element za pomocą funkcji JavaScript, w ten sposób:
var select_element = document.getElementById ('your_element_ID'); multi (select_element);
W tej chwili wtyczka nie obsługuje grup optycznych ale ta funkcja jest w pracach.
Tak czy inaczej, domyślna funkcjonalność jest oszałamiająca. Działa tak, jak się tego spodziewasz i to obsługuje nawet mobilne układy responsywne.
Aby dowiedzieć się więcej, sprawdź Repo GitHub który obejmuje również pliki do pobrania. Multi.js strona demonstracyjna jest świetny do zobaczenia, jak ta wtyczka działa w przeglądarce. Ale tak naprawdę jest to prosty sposób przeprojektuj wybrane menu jednocześnie poprawiając ogólne wrażenia użytkownika z formy.