46 of 133 menu

Sisestuselement input

input-element loob erinevaid HTML-vormi elemente: tavaline sisestusväli, parooli sisestusväli, märkeruut (checkbox), raadionupp (radio), nupp.

input-element peaks asuma form-elemendi sees. See pole kohustuslik, kuid on vajalik andmete saatmiseks serverisse ja nende järgneks töötluseks PHP kaudu.

Ei vaja sulgev elementi.

Atribuudid

Atribuut Kirjeldus
type Määrab sisestusvälja tüübi. Valikud vt allpool.
value Vaikeväärtus sisestusväljal. Nupu puhul määrab selle teksti. Üksikasjalikumalt vt atribuuti value.
placeholder Vihje sisestusväljal, üksikasjalikumalt vt atribuuti placeholder.
name Sisestusvälja nimi. Vajalik, et sisestusvälja andmeid PHP-s kätte saada. Vormi korrektseks toimimiseks ei tohiks sisestusväljade nimed üksteisega kattuda (ühes vormis). Kui need kattuvad - PHP-sse jõuavad andmed sellest sisestusväljast, mis on HTML-koodis allpool.
disabled Blokeerib vormielemendi (mitte ainult input, vaid peaaegu iga), üksikasjalikumalt vt atribuuti disabled.

Atribuudi type väärtused

Väärtus Kirjeldus
text Loob tavalise tekstisisestusvälja.
password Loob tekstisisestusvälja parooli jaoks. Proovige sinna teksti sisestada - see kuvatakse tärnidena.
checkbox Loob märkeruudu (checkbox). Üksikasjalikumalt vt checkbox.
radio Loob raadioknöpnu (radio). Üksikasjalikumalt vt radio.
hidden Loob peidetud inputi, mis ei ole ekraanil nähtav, kuid saadab serverisse atribuudis value sisalduvad andmed.
button Loob nupu. Selle nupu vajutamine ei saa vormi serverisse. Seda saab kasutada lingi sees või JavaScript kaudu. Vaikimisi pole nupul teksti (näide nupust ilma tekstita: ), see määratakse atribuudiga value. Vaata ka elementi button, mis loob samuti nupu.
submit Loob nupu, mis saadab andmed serverisse. Nupu tekst sõltub brauserist, seda saab muuta atribuudiga value. Vaata ka elementi button, mis loob samuti nupu.
reset Loob nupu, mis tühjendab täidetud vormi. Nupu tekst sõltub brauserist, seda saab muuta atribuudiga value.
file Loob faili valimise nupu. Selle nupu disaini ei tohi muuta CSS-i kaudu (kuid on olemas keerulised viisid). Kui teil on vaja sellist välja vormis, siis form-element peab omama atribuuti enctype väärtusega multipart/form-data.

Uued HTML5-s atribuudi type väärtused

Need atribuudi väärtused on uued, ilmusid alles HTML5-s, seega mõnes brauseris need ei pruugi toimida või toimivad erinevalt erinevates brauserites.

Juhul, kui brauser ei suuda atribuudi type sisust aru saada (näiteks kui seda ei toetata või on see valesti sisestatud), peab ta elementi tavaliseks tekstisisestusväljaks, nagu oleks type väärtuseks text.

Vaadake allolevaid näiteid erinevates brauserites. Proovige sisestada inputitesse teksti ja vajutada saatmise nuppu. Kui tekst on sobimatu või väli on tühi - annab brauser veateate. Näiteks kui tüübiga email väljale sisestada sobimatu e-posti aadress - brauser ei luba vormi saata ja annab veateate (vea teksti ja selle välimust HTML-i ega CSS-i abil muuta ei saa). Kui väli on tühi - annab brauser samuti vea, see saavutatakse atribuudi required abil:

Väärtus Kirjeldus
email
number
url
tel
search
color
date
month
week
datetime
datetime-local
range

Vaata ka

  • element textarea,
    mis loob mitmerealise sisestusvälja
  • atribuut pattern,
    mis teostab väljade valideerimist
Eesti
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItaliano日本語ქართულიҚазақ한국어КыргызчаLietuviųLatviešuМакедонскиMelayuမြန်မာNederlandsNorskPolskiPortuguêsRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliТоҷикӣไทยTürkmenTürkçeЎзбекOʻzbekTiếng Việt
Me kasutame saidi toimimiseks, analüüsi ja personaliseerimiseks küpsiseid. Andmete töötlemine toimub vastavalt Privaatsuspoliitikale.
nõustu kõigega häälesta keeldu