Multi.js - Ein benutzerfreundliches Auswahlfeld, das mit reinem JavaScript erstellt wurde
Wählen Sie Menüs aus sind primitiv, aber sie funktionieren. Dasselbe gilt für alle typischen Formulareingaben wie Ankreuzfelder und Radio Knöpfe.
Es ist jedoch leicht, eigene Formulare zu erstellen Oberflächenelemente von Grund auf neu erstellen kann hart sein Deshalb Multi.js ist so ein wertvolles plugin für Ersetzen der Standardauswahlfelder.
Mit Multi.js können Sie Geben Sie den Besuchern eine Liste mit Artikeln zur Auswahl mit einer in das Formular integrierten Mehrfachauswahl. Auf diese Weise können Benutzer Klicken Sie auf mehrere Elemente ohne sich auf Kontrollkästchen zu verlassen.
Dieses Skript sogar unterstützt eine Suchfunktion, So können Benutzer nach Elementen suchen, wenn die Liste besonders lang ist.
Ich finde das Menü auch ziemlich intuitiv, also braucht nicht viel zu erklären. Sie klicken auf ein Element auf der linken Seite, um es der rechten Spalte hinzuzufügen (oder “ausgewählt” Artikel). Klicken Sie anschließend auf Elemente in der rechten Spalte, um sie zu entfernen.
Alles läuft auf Vanille-JavaScript, einschließlich der Suchfunktion, damit Sie keine Abhängigkeiten benötigen. Obwohl es unterstützt jQuery wenn Ihre Site diese Bibliothek verwendet.
Dazu benötigen Sie lediglich die Datei Multi.js und das CSS-Stylesheet. Als nächstes nur du ein ... kreieren Element und Richten Sie das Element mit einer JavaScript-Funktion aus, wie so:
var select_element = document.getElementById ('Ihre_element_ID'); multi (select_element); Im Moment das Plugin unterstützt keine optgroups aber diese Funktion ist in Arbeit.
In beiden Fällen ist die Standardfunktionalität umwerfend. Es funktioniert genau so, wie Sie es erwarten würden unterstützt sogar mobile responsive layouts.
Um mehr zu erfahren, lesen Sie die GitHub-Repo welche enthält auch herunterladbare Dateien. Die Multi.js Demo-Seite ist toll zu sehen, wie dieses Plugin funktioniert im Browser. Aber eigentlich ist es nur ein einfacher Weg Gestalten Sie Ihre ausgewählten Menüs neu während Sie die allgemeine Benutzererfahrung Ihres Formulars verbessern.
