Šiame vadove išmoksi, kaip gali kompleksiškai patikrinti savo internetinių formų reikalavimus ir modelį su HTML atributais reikalingais ir šablonu. Šios funkcijos yra ypatingai naudingos užtikrinant, kad vartotojų įvestys atitiktų norimą formatą ir neperduotų tuščių laukų. Tu būsi palydėtas per pagrindinius žingsnius ir pamatysi, kaip efektyviai gali naudoti šiuos atributus savo formose.

Svarbiausios išvados

  • Atributas required užtikrina, kad laukelis būtų užpildytas.
  • Su atributu pattern galite nustatyti reguliariąjį išraiškos patikrinimą tam tikriems formatams.
  • Vartotojams svarbu turėti draugiškus klaidos pranešimus dėl teigiamo naudotojo patyrimo.

Vadovas žingsnis po žingsnio

Naudodami required atributą

Jei norite užtikrinti, kad laukelis būtų privalomas, galite naudoti atributą required. Tiesiog pridėkite šį atributą prie savo žymės. Nereikia nurodyti reikšmės; pakanka nustatyti atributą.

Tinklinių formų patvirtinimas naudojant „pattern“ ir „required“

Jei forma yra tuščia ir bandote ją pateikti, naršyklė jums rodo klaidos pranešimą, kad laukelį reikia užpildyti. Taigi, required atributas užtikrina, kad įvestis būtų privaloma.

Tinklo formų patvirtinimas naudojant „pattern“ ir „required“

Vadovavimosi privalomumu su kitais atributais derinys

Be required atributo, galite nustatyti reikšmes šalutiniams niuansams ir maksimaliam ilgiui, ribojančiam naudotojui įvesti simbolių kiekį.

Tinklinio formų patvirtinimas naudojant „pattern“ ir „required“

Pavyzdžiui, nurodę, kad būtina įvesti bent 10 simbolių, tai taip pat veikia kartu su required atributu. Jei naudotojas įveda mažiau nei 10 simbolių, validacija nepavyksta.

Tinklo formų validavimas naudojant modelį pattern ir privalomus laukus

Įvadas į pattern atributą

Pattern atributas leidžia jums nurodyti konkrečią įvesties patikrinimą naudojant reguliariuosius išrašus. Čia jūs nurodote reguliaraus išraiškos modelį kaip eilutę, kuri turėtų patikrinti įvestą tekstą.

Tinklalapių formų validacija naudojant „pattern“ ir „required“

Pavyzdžiui, paprastas Regex modelis būtų, kad naudotojas turi įvesti bet kokią eilutę, nes straipsnyje turi būti "ABC" pabaigoje. Tai galėtų atrodyti taip: .*ABC$.

Nekorektiškų įvesties klaidų pranešimas

Kai naudotojas įveda tekstą, neatitinkantį nurodyto modelio, jis gauna bendrinį klaidos pranešimą, pvz., "prašome atitikti pageidaujamą formatą".

Tinklinio formų validacija naudojant "pattern" ir "required

Siekiant padėti naudotojams, svarbu turėti prasmingesnį klaidos pranešimą. Tai galima pasiekti naudojant title atributą. Pavadinimas bus naudotojui rodomas kaip pastaba, kai jis nurodytame lauke užveda pelę.

Tinkamų interneto formų patikrinimas naudojant modelį ir privalomus laukus

Naudojimas title atributu, padedant naudotojams

Naudojant title atributą, galite suteikti aiškų atsiliepimą, kokią informaciją laukelis turi laukti. Pavyzdžiui, galėtumėte naudoti pavadinimą "Įveskite ID minus po to sekančiais penkiais skaičiais", kad aiškiai parodytumėte naudotojui, kokios įvesties formos tikimasi.

Tinklalapių formų validavimas naudojant „pattern“ ir „required“

Specifinių įvesties modelių patikrinimas

Dar vienas pavyzdys yra tikrinimas atitinkamam modeliui, kuris priima tik skaičius. Galite nustatyti regex modelį, kuris prasideda tam tikru priesaga ir leidžia tik penkias skaitmenis.

Tinklo formų validacija naudojant modelį ir privalomąją sąlygą.

Jei vartotojas įveda per daug arba per mažai skaičių ar net raides, patikrinimas nepavyks.

Tinklalapių formų tikrinimas naudojant „pattern“ ir „required“

Apibendrinimas apie patikrinimą

Tinkamumas interneto formų naudojant šabloną ir privalomą užpildymą

Apgyvendinimas

Šiame vadove sužinojote, kaip, naudojant reikiamą ir modelį, įgyvendinti sudėtingą patikrinimą interneto formose. Šie aspektai užtikrina, kad vartotojo įvestys atitiktų konkretų reikalavimą ir leidžia pritaikyti klaidos pranešimus vartotojams.

Daugiausia užduodami klausimai

Kokį tikslą turi reikiamasis atributas?Reikiamasis atributas užtikrina, kad prieš siunčiant formą, įvesties laukas turi būti užpildytas.

Kaip naudoti modelio atributą?Modelio atributas leidžia jums taikyti reguliarią išraišką, užtikrinant, kad įvestis atitiktų tam tikrą formatą.

Kaip aiškiau pranešti vartotojams, ką jie turi įvesti?Naudodami atributą "title", galite pateikti naudingą informaciją apie tikėtinas įvestis, rodomas patarime, kai vartotojas veda virš įvesties lauko.