Dropdown väljer i HTML är några av de mest nativt användarvänliga objekten. Styling dem är en smärta och vid deras basfunktionalitet är de inte särskilt användbara om du inte har en begränsad mängd objekt med en begränsad mängd behov.
Det är där Chosen kommer in. Det är ett javascript-bibliotek som gör dropdown-upplevelsen mycket snyggare, liksom mycket trevligare från ett funktionalitetsperspektiv också.
Välj ... RedPurpleBlueYellowGreenBlackWhite
Ovan kan du se standard vald funktion. Det ser bra ut, och som standard har en enkel sökmekanism att filtrera genom resultat om du har en stor mängd objekt i din rullgardinsmeny. Först, inkludera javascript och css-filer. Starta sedan dem med koden nedan.
$ (dokument) .ready (funktion () {$ (".valgt") .valgt ();}); Det är lika enkelt som det. Låt oss nu ta det till nästa nivå, vad händer om du ville kunna ändra rullgardins funktionalitet för att tillåta flera val? Sök efter "Red" nedan och tryck sedan på Enter, sök efter "Blue" och tryck sedan på Enter. Nu kan du ta bort dem lika enkelt från ditt val genom att bara slå X eller backspace två gånger.
Välj ... RedPurpleBlueYellowGreenBlackWhite
Allt du behöver göra är att skicka alternativet flera i samtalet av välj som nedan. Det går inte att ändra javascript, det initialiseras exakt samma sätt.
Kolla in demoen nedan eller ladda ner exemplen i en blixtlås.
