Hisia ya kifupi ya <input> ya HTML

HTML <input> mtagu

Makadaro na matumizi

pattern Hisia inasimamia kifupi cha kifupi, inakisia ukurasa wa <input> kwa kifupi hiki wakati wa kuingiza fomu.

Kujaatishia:pattern Mfumo wa hisia hauwezi kutumika kwa aina za kuingia zifuatazo:

  • tekst
  • tarehe
  • tafuta
  • url
  • simu
  • barua pepe
  • sifuri

Msaada:Kutumia Mfumo wa title wa kuzuri kuonekana kwa mpangilio huu, kusaidia mtumiaji kuafahamika.

Msaada:Tafadhali nina hapa Mafaa ya JavaScript Kueleza juu ya ujuzi wa kifupi katika kuzalisha.

Mfano

Mfano 1

Hapa ni muundo wa fomu ya HTML yenye ukurasa wa kuingia, inayoweza kuwa na herufi tatu tu (haingie cifada au herufi za kizamani):

<form action="/action_page.php">
  <label for="country_code">Kampi ya kifungu cha nchi:</label>
  <input type="text" id="country_code" name="country_code"}
  pattern="[A-Za-z]{3}" title="Koodi wa nchi ya tatu ya herufi"><br><br>
  <input type="submit">
</form>

Mafaa ya kumtumia

Mfano 2

Hapa ni elementi ya <input> na kiwango cha 'password', inahitaji kuwa na herufi wengi sana 8 au zaidi:

<form action="/action_page.php">
  <label for="pwd">Namba ya nywila:</label>
  <input type="password" id="pwd" name="pwd"
  pattern=".{8,}" title="Herufi 8 au zaidi">
  <input type="submit">
</form>

Mafaa ya kumtumia

Mfano 3

Hapa ni elementi ya <input> na kiwango cha 'password', inahitaji kuwa na herufi 8 au zaidi, na kumiliki herufi moja ya namba, herufi kubwa na herufi ndogo:

<form action="/action_page.php">
  <label for="pwd">Namba ya nywila:</label>
  <input type="password" id="pwd" name="pwd"
  pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}"
  title="Inahitaji kuwa na herufi wengi sana, na kumiliki herufi moja ya namba, herufi kubwa na herufi ndogo">
  <input type="submit">
</form>

Mafaa ya kumtumia

Mfano 4

Hapa ni elementi ya <input> na kiwango cha 'email', inahitaji kuwa kama hivi: characters@characters.domain.

Inajumuisha herufi na simboli ya @ na baadae yana wafupi karibu na herufi, baadae ni herufi moja ya '.'. Baada ya '.', ingingaa herufi mbili kwa siku za a kuwa z kwa herufi za kwanza za 'a' hadi 'z':

<form action="/action_page.php">
  <label for="email">Barua pepe:</label>
  <input type="email" id="email" name="email"
  pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,}$">
  <input type="submit">
</form>

Mafaa ya kumtumia

Mfano 5

Hapa ni elementi ya <input> na kiwango cha 'search', haingawakilishwi herufi hizo: ' au " .

<form action="/action_page.php">
  <label for="search">Tafuta:</label>
  <input type="search" id="search" name="search"
  pattern="[^'\x22]+" title="Input huzuiwa hatau">
  <input type="submit">
</form>

Mafaa ya kumtumia

Mfano 6

Hapa ni elementi ya <input> na kiwango cha 'url', inahitaji kuwakilisha http:// au https:// na baadae yana wafupi karibu na herufi moja:

<form action="/action_page.php">
  <label for="website">Homepage:</label>
  <input type="url" id="website" name="website"
  pattern="https?://.+" title="Inahusiana na http://">
  <input type="submit">
</form>

Mafaa ya kumtumia

Inayotumika kwa kawaida

<input pattern="regexp">

Mafuta ya mafuta

Wakati Maelezo
regexp Inasababisha uangalifu wa uadilifu wa kina kwa kufikiria <input> kwa kuzingatia inayotumiwa kwa kawaida.

Mwongozo wa kawaida

Inanzi zilizotababisha katika tabia hii ni na kawaida kwa kusafirisha tabia hii kwa sababu ya kawaida.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
5.0 10.0 4.0 10.1 9.6

Maelezo:pattern Mafuta ni mafuta mpya ya HTML5.

HTML <input> mtagu