Flexdatalist - vtičnik za samodokončanje z
The HTML5 element je zelo uporaben v sodobnem razvoju frontendov. Vendar je to eden od tistih elementov, o katerih ne vedo veliko razvijalcev.
Deluje na vnosnem polju, kjer lahko samodejno predlaga določene vrednosti za vnos. Privzeta nastavitev je v redu in obravnavali smo nekaj kodirnih nasvetov za izdelavo kul efektov s samodejnim predlogom podatkovnih datotek.
Vendar pa je veliko lažje delo z vtičnikom kot naprimer Flexdatalist. To podpira širšo paleto brskalnikov in vam omogoča popolnoma prilagodite obliko vašega podatkovnega lista.
Vsi ne potrebujejo funkcij za samodokončanje in z izvornimi podatkovnimi bazami HTML5 morda ne boste imeli težav z vtičnikom. Vendar pa je Flexdatalist morda najboljši, ker je to gradi na izvornem podatkovnem vedenju dodati:
- Mobilna odzivna podpora
- Dodatni opisi za vsako postavko
- Možnosti za več izbir naenkrat
- Upravljalniki dogodkov po meri
To je vse jih poganja jQuery, tako boste potrebujete kopijo najnovejše različice da se to izvaja. Tudi ima lastno slogovno datoteko CSS ki jih želite združiti v eno samo datoteko CSS, da zmanjšate zahteve HTTP.
Lahko najdeš popolna navodila za namestitev na glavni demo strani, ki vključuje prenesete povezave do datotek Flexdatalist.
Zelo preprosto je nastaviti, z samo eno vrstico JavaScripta. Privzeto je vtičnik cilje na vse vnose z razredom .flexdatalist
, tako, da bi dodali, da je vaša koda dovolj, da vidite rezultate.
Samo dodaš element znotraj vnosnega polja in Flexdatalist obravnava ostalo. To bo samodejno slog seznama, vključno z neobveznim opisnim besedilom.
Najenostavnejši način za dodajanje dodatnega besedila je prek datoteke JSON ki jih lahko priložite vnosu prek podatkovnega atributa.
Na primer, če si ogledate demo stran Flexdatalist, boste našli a “Države” polje z atributom data-data = 'countries.json'
. To se nanaša na oddaljeno datoteko vse zunanje vhodne podatke shranjuje navzven.
Preveč teh polj lahko nekoliko upočasni stran. Vendar si ne morem predstavljati, da bi veliko spletnih mest delovalo na več kot nekaj teh podatkovnih obrazcev na eni strani, da ne omenjam niti s tem vtičnikom jQuery. še vedno zelo hitro.
Če želite začeti, samo obiščite GitHub repo in prenesite kopijo. To vključuje a povezavo na glavno predstavitveno stran ki vsebuje tudi popolno dokumentacijo za nastavitve, možnosti JavaScripta in veliko vzorčnih odrezkov kode, ki jih lahko uporabite.