Formulare mobile: cum să înlocuiți listele derulante. Suport pentru formulare mobile HTML5 și tipuri de introducere HTML
JQuery Mobile adaugă automat un stil formularelor HTML, făcându-le mai atractive, mai ușor de utilizat la atingere.
Structura formularului mobil JQuery
JQuery Mobile pentru a utiliza CSS pentru a stila elemente formular HTML pentru a le face mai atractive și mai ușor de utilizat.
În jQuery Mobile, puteți utiliza următoarele elemente forme:
- câmp de introducere a textului
- Căutați un câmp de introducere
- buton de radio
- Caseta de bifat
- Selectați Meniu
- glisor
- Flip comutator
Când utilizați jQuery Mobile Form, ar trebui să știți:
- <Форма>elementul trebuie să aibă o metodă și un atribut de acțiune
- Fiecare element de formular trebuie să aibă un atribut unic „ID”. ID-ul trebuie să fie unic pe toate paginile de pe site. Acest lucru se întâmplă pentru că Jquery Mobile mecanismul de navigare pe o pagină este prezentat în așa fel încât mulți diverse pagini simultan
- Fiecare element de formular trebuie să aibă o etichetă. fila Setări Pentru proprietăți pentru a se potrivi cu id-ul elementului
exemple
Incearca-l "
Pentru a ascunde o etichetă, utilizați clasa UI-hidden-accessible. Acesta este adesea folosit atunci când atribuiți un element ca etichetă de substituent:
exemple
Incearca-l "
Sfat: Putem folosi atributul data-net-BTN="true" pentru a adăuga un buton pentru a șterge conținutul câmpului de introducere (pictograma X din dreapta câmpului de intrare):
exemple
<Ярлык = "имя_файла">Nume: метка>
<Входной тип = "текст" имя = "имя_файла" ID = "имя_файла" данных четко БТН = "истинный">
Incearca-l "
Pictograma jQuery Mobile Forms
Formular cod de buton HTML standard <вход>element (buton, resetare, trimitere). Ei vor reda automat stilurile, se vor adapta automat dispozitive mobile pe desktop:
exemple
<Тип входного = "Сброс" значение = "кнопка сброса">
Incearca-l "
Dacă trebuie să adăugați stiluri suplimentare la<вход>butonul, puteți utiliza următorul tabel de date-*atribute:
Buton pentru a adăuga o pictogramă:
<Тип входного = "Сброс" значение = "кнопка сброса">
Incearca-l "
Câmp container
Pentru a face etichetele și elementele de formular să pară mai potrivite pentru ecran lat va rog sau