Nuppude loomine HTML-vormingus sisendmärgendite abil

click fraud protection

Looge rakenduses kohandatavad tekstinupud HTML kasutades sisend silt. The sisend elementi kasutatakse a piires vormis element.

Seadistades atribuuttüüp nupule, genereeritakse lihtne klõpsatav nupp. Nupul kuvatavat teksti, näiteks "Esita", saate määratleda, kasutades nuppu väärtus atribuut. Näiteks:


The sisend silt ei esita HTML-vormi; peate lisama JavaScripti vormiandmete esitamisega hakkama saama. Ilma JavaScripti onclick juhul näib, et nupp on klõpsatav, kuid midagi ei juhtu ja te olete oma lugejaid pettunud.

„Nupu” sildi alternatiiv

Kuigi kasutades sisend nupp nupu loomiseks töötab oma eesmärgil, see on parem variant nuppu oma veebisaidi HTML-nuppude loomiseks. The nuppu silt on paindlikum, kuna see võimaldab nupu jaoks kasutada pilte (mis aitab teil visuaalset järjepidevust säilitada, kui teie saidil on näiteks kujundusteema) ja seda saab määratleda kui nuppu "Esita" või "Lähtesta", ilma et oleks vaja midagi täiendavat JavaScripti.

Määrake nupp tüüp atribuut mis tahes nuppu sildid. Neid on kolme erinevat tüüpi:

instagram viewer
  • nuppu: Nupul pole olemuslikku käitumist, kuid seda kasutatakse koos kliendipoolsete skriptidega, mille saab nupule kinnitada ja käivitada, kui sellel klõpsatakse.
  • lähtestamine: Lähtestab kõik väärtused.
  • Esita: Nupp saadab vormiandmed serverile (see on vaikeväärtus, kui tüüpi pole määratletud).

Muud atribuudid on:

  • nimi: Annab nupule viitenime.
  • väärtus: Määrab nupule algselt omistatava väärtuse.
  • keelata: Lülitab nupu välja.

Nuppudega edasi minnes

HTML5 lisab failile täiendavad atribuudid nuppu silt, mis laiendab selle funktsionaalsust.

  • autofookus: Lehe laadimisel määrab see valik, et see nupp on fookuses. Lehel saab kasutada ainult ühte autofookust.
  • vormis: Seostab nupu konkreetse vormiga samas HTML-dokumendis, kasutades väärtusena vormi identifikaatorit.
  • moodustamine: Kasutatakse ainult koos type = "esita" ja väärtusena URL, määrab see, kuhu vormiandmed saadetakse. Sageli on sihtkohaks PHP skript või midagi muud sarnast,
  • vormi tüüp: Kasutatakse ainult koos type = "esita" atribuut. Määrab, kuidas vormi andmeid serverisse esitamisel kodeeritakse. Need kolm väärtust on application / x-www-form-urlencoded (vaikimisi), mitmeosaline / vormiandmed, ja tekst / tavaline.
  • vormimeetod: Kasutatakse ainult koos type = "esita" atribuut. See määrab, millist HTTP-meetodit vormiandmete esitamisel kasutada saada või postitus.
  • formnovalidaat: Kasutatakse ainult koos type = "esita" atribuut. Vormi andmeid ei kinnitata esitamisel.
  • formtarget: Kasutatakse ainult koos type = "esita" atribuut. See näitab, kus saidi vastus kuvatakse vormiandmete esitamisel, näiteks uues aknas jne. Väärtusvalikud on mõlemad_blank, _self, _parent, _top, või konkreetse raami nimi.

Loe lähemalt nuppude tegemine HTML-vormidesja kuidas oma saiti kasutajasõbralikumaks muuta.

instagram story viewer