Lomake (HTML)

Lomake ( englanninkielinen  lomake ) HTML:ssä on asiakirjan osa, jonka avulla käyttäjä voi syöttää tietoja järjestelmän jatkokäsittelyä varten. Syntaktisesti HTML:n lomake määritetään elementillä ja <form>sisältää tavallisten elementtien merkintöjen lisäksi merkinnät säätimille , tunnisteille ja muille [ 1] [ 2] .  

Esimerkki

Yksinkertainen lomake uuden käyttäjän tietojen syöttämiseen [1] :

<!DOCTYPE html> < html > < head > < meta charset = "utf-8" /> < otsikko > Rekisteröinti </ title > </ head > < body > < form action = "http://example.com/app/profile.php" method = "post" > < p > < label for = "käyttäjänimi" > Nimi: </ label > < input type = "text" name = "käyttäjänimi" /> < br /> < label for = "nick" > Nick: </ label > < input type = "text" name = "nick" /> < br /> < label for = "email" > Sähköpostiosoite posti: </ label > < input type = "text" name = "email" /> < br /> < label for = "sex" > Lattia: </ label > < input type = "radio" name = "sex" value = "mies" /> Uros < br /> < syöttötyyppi = "radio" nimi = "sukupuoli" value = "nainen" / > Nainen < br /> < syöttötyyppi = "radio" nimi = "sukupuoli" arvo = "salainen" / > En halua vastata < input type = "submit" value = "Lähetä" > < input type = "reset" value = "Tyhjennä" > </ p > </ form > </ body > </ html >

Tässä esimerkissä lomake sisältää kolme tekstikenttää merkkijonon syöttämistä varten, valintanapit sukupuolen valitsemiseksi, painikkeet lomakkeen lähettämistä ( eng.  send ) ja tyhjentämistä ( eng.  reset ) varten.

Säätimet

Säätimiä käytetään käyttäjän vuorovaikutukseen lomakkeen kanssa. Attribuutti määrittääname suojatun ohjausobjektin nimen annetussa lomakkeessa.

Jokaisella lomakeelementillä on alkuarvo ja siihen liitetty nykyinen arvo. Joitakin poikkeuksia ( <textarea>, <object>) lukuun ottamatta alkuarvon voi antaa value. Elementteihin liittyvät arvot voivat muuttua, kun käyttäjä tai komentosarjat (kuten Javascript ) ovat vuorovaikutuksessa lomakkeen kanssa. Nollattaessa ( eng.  reset ) lomakeelementit saavat alkuarvot. Kaikkien aktiivisten ( suorituskykyisten) lomakeelementtien tiedot lähetetään (eng. submit )  käsittelyyn nimi - arvo-parien muodossa [1] [2] .  

Tyypit

Seuraavat säätimet on määritelty HTML:ssä:

  • painike: <input>tyyppien elementti submit(lomakkeen lähettäminen), image(kuva-painike), reset(lomakkeen tyhjennys, lomakkeen saattaminen alkutilaan), button(painike) sekä elementti <button>(lomakkeen lähettäminen);
  • valintaruutu (valintaruutu): tyyppi checkbox;
  • valintanappi : tyyppi radio;
  • valikko: elementti <select>elementeillä <optgroup>ja <option>sisällä;
  • tekstirivi: tyyppi textja elementti <textarea>(monirivinen tekstikenttä);
  • salasana: kirjoita password;
  • piilotettu kenttä: tyyppi hidden;
  • tiedosto: tyyppi file.

HTML5 määrittelee lisäelementtejä ( ei vielä selaimen välistä tukea ) [3] :

  • elementti <datalist>, jossa on tekstirivin automaattinen täydennysvaihtoehdot;
  • elementti <output>muihin kenttiin perustuvan laskennan tulokselle;
  • elementti <keygen>avainparin luomiseksi käytettäväksi todennusmekanismissa .

<form>-elementti

Lomake asetetaan elementillä <form>, jonka sisällä säätimet sijaitsevat. HTML:lle yhteisten attribuuttien lisäksi <form>seuraavat [1] [2] voivat olla läsnä :

  • action(action) on pakollinen attribuutti (ei HTML5:ssä), joka sisältää lomakekäsittelijän URI :n;
  • method(lomakkeen lähetysmenetelmä) - attribuutti, joka ottaa arvot GET (oletus) tai POST;
  • enctype(sisällön koodaustyyppi) - oletus application/x-www-form-urlencoded(aina GET-menetelmälle), mutta yleensä käytetään moniosaista/muototietoa ;
  • accept — luettelo MIME -tyypeistä tiedostojen lataamista varten;
  • name - lomakkeen nimi;
  • onsubmit - Tapahtumakäsittelijä "lomake lähetetty" (skripteille);
  • onreset - Tapahtumakäsittelijä: "lomake tyhjennetty" (myös komentosarjoille);
  • accept-charsetluettelo tuetuista merkistöistä.

Lomakkeen lähettäminen

Lomakkeen lähettämiseen on kaksi tapaa: GET ja POST. GET-menetelmää suositellaan tapauksissa, joissa palvelinpuolen lomakkeiden käsittelyssä ei ole sivuvaikutuksia, kuten haku. Muussa tapauksessa, kun tietokantoihin jne. sisältyy palvelinpuolen muutoksia, on käytettävä POST [1] -menetelmää .

Katso myös

Muistiinpanot

  1. ↑ 1 2 3 4 5 HTML Language Specification Arkistokopio päivätty 4. joulukuuta 2012 Wayback Machinessa , kääntäjä: A. Piramidin, intuit.ru, ISBN 978-5-94774-648-8 , 17. Luento: Forms.
  2. ↑ 1 2 3 lomakkeet HTML-dokumenteissa Arkistoitu 22. huhtikuuta 2021 Wayback Machine  W3C -määrittelyssä HTML4:lle
  3. ↑ HTML5 Form Elements, w3schools (downlink) . Haettu 2. joulukuuta 2012. Arkistoitu alkuperäisestä 13. toukokuuta 2013.