Šajā rokasgrāmatā es tev parādīšu, kā implementēt abas ievades laukus search un tel savos tīmekļa veidlapās. Šie ievades veidi ir paredzēti meklēšanas vaicājumiem un tālruņa numuriem, piedāvājot dažas noderīgas funkcijas, kas var padarīt jūsu un jūsu lietotāju dzīvi vieglāku. Tu iemācīsies, kā pareizi izmantot šos ievades laukus un kādas priekšrocības tie nes līdz.
Svarīgākie secinājumi
- Ievades lauki search un tel piedāvā vienkāršus veidus, kā implementēt meklēšanas un tālruņa numura ievades veidlapas.
- search funkcionalitāte tiek atbalstīta daudzās pārlūkprogrammās un tai ir dažas lietotājam draudzīgas īpašības, savukārt tel ir paredzēts īpaši telefonu numuru ievadīšanai.
- Abiem nav īpašas validācijas funkcijas, taču tās var papildināt ar regulārajiem izteikumiem.
Ievades lauka tips "search"
Ievades lauks parasti tiek attēlots ar vienkāršu teksta ievades lauku, kuram, piemēram, Chrome parāda "X", lai dzēstu ievadi. Šī funkcija ir noderīga, jo ļauj lietotājiem ātri dzēst ievadīto meklēšanas vaicājumu un sākt jaunu ievadi.
Arī tu vari iespējot norādi, kas parāda lietotājiem, ko šajā laukā ievadīt. Piemēram, pievienojot kā norādi "Meklēšanas vārdu", šis teksts tiks automātiski paslēpts, kad tiks ievadīts teksts. Tas nodrošina skaidru lietotāju vadību.
Validācija nav iepriekš noteikta šāda tipa ievades laukiem. Tomēr, ja vēlies izvirzīt īpašas prasības ievadītajiem datiem, vari izmantot regulāros izteikumus (RegEx).
Ievades lauka tips "tel"
Pēc tam aplūkojam tālruņa numura ievades lauku, jeb tel. HTML struktūra ir līdzīga, bet nolūks ir cits.
Ar tel tipu pārlūks zina, ka lietotājam jāievada tālruņa numurs. Mobilajos ierīcēs parasti tiek rādīta tikai numeriskā tastatūra, kas ievadu daudz vienkāršo.
Nav lielu atšķirību salīdzinājumā ar parasto teksta ievades lauku. Arī šeit vari izmantot norādi, lai sniegtu norādes vai norādītu īpašus formātus, piemēram, valsts koda formātu.
Vēl viena priekšrocība ir tas, ka ekrāns lasīs palīgvalods ievades lauks. Tu sniedz pārlūkam un it īpaši cilvēkiem ar ierobežotām spējām skaidru norādi, ka šajā laukā vajadzētu ievadīt tālruņa numuru. Tas var ievērojami uzlabot tavas tīmekļa lietotnes pieejamību.
Tālruņa numuru validācija
Ja vēlies nodrošināties, ka lietotāji ievada pareizu tālruņa numuru, ieteicams izmantot RegEx ievades datiem. Vari viegli pielāgot reglamentējumus atkarībā no tā, vai vēlies atbalstīt valsts vai starptautiskos tālruņa numurus.
Vācijas tālruņu numuru RegEx būtu labs sākumpunkts. Starptautiskiem numuriem tas kļūst sarežģītāks, jo dažādas valstis ir atšķirīgi tālruņa numuru formāti. Laba stratēģija varētu būt vispirms izvēlēties valsti un tad piemērot specifisku validāciju izvēlētajai valstij.
Kopsavilkums
Kopumā var teikt, ka search un tel tipi tīmekļa veidlapās ir salīdzinoši viegli implementējami. Lai gan tie nepiedāvā plašas funkcijas, tie tomēr pārliecina ar savu semantiku un lietotājam draudzīgo pieeju. Izmantojot šos tipus, tu vari ievērojami uzlabot savas tīmekļa vietnes lietotāju pieredzi.
Bieži uzdotie jautājumi
Kādas ir galvenās atšķirības starp search un tel?Galvenā atšķirība ir semantikā: search paredzēts meklēšanas vaicājumiem, bet tel - tālruņa numuriem.
Vai search un tel tipi piedāvā īpašas validācijas funkcijas?Nē, šie tipi nepiedāvā īpašas validācijas funkcijas, bet tos var papildināt ar regulāriem izteikumiem.
Kā pievienot norādi ievades laukam?Var vienkārši pievienot placeholder atribūtu savai ievadei HTML.
Kādas priekšrocības šiem tipiem ir attiecībā uz lietotāju pieredzi?Viņi uzlabo lietotāja pieredzi, parādot atbilstošas ievades tastatūras mobilajās ierīcēs un sniedzot lietotājiem nekavējoties redzamus norādījumus.
Uz ko jākoncentrējas, ja vēlos atbalstīt starptautiskos tālruņa numurus?Jāizveido izvēles lauks valstij un pēc tam jāvalidē tālruņa numurs, pamatojoties uz šīs valsts specifikācijām.
