Home-theater-designers
Tietojen kerääminen verkkosivuston käyttäjältä voidaan tehdä useilla eri tavoilla. Verkkosivustojen lomakkeilla voi olla yksinkertainen toiminto, kuten käyttäjän tilaaminen uutiskirjeeksi, tai monimutkaisempi tarkoitus, kuten toimiminen työhakemuslomakkeena.
Kaikilla näillä yksinkertaisilla ja monimutkaisilla muodoilla on kuitenkin yksi yhteinen asia HTML ja tarkemmin sanottuna HTML tag.
Lomaketunnisteen käyttäminen
The tag on HTML -elementti, jota käytetään säilönä muiden elementtien liittämiseen, joita voidaan pitää lomakkeiden rakennuspalikoina. Jotkut näistä perustekijöistä sisältävät tunniste, tunniste ja tag.
The tunnisteella on tärkeä ominaisuus, joka edistää sen toimivuutta. Tätä määritettä kutsutaan toiminnoksi, ja sitä käytetään tunnistamaan tiedosto, jolle lomakkeeseen syötetyt tiedot välitetään.
Tag Esimerkki
Yllä oleva esimerkki näyttää lomaketunnisteen käyttämisen projekteissasi. Yksi tärkeimmistä takeista on, että jos avaat lomaketunnisteen, muista sulkea se. Tämä luo lomakerakenteen ja varmistaa myös, että lomakkeeseen syötetyt tiedot käsitellään oikein.
Tunnisteen käyttäminen
The -tunnistetta käytetään kuvaamaan lomakkeen kunkin syöttökentän tiedot. Tässä tunnisteessa on varten attribuutti, jota käytetään parantamaan lomakkeen toimivuutta.
Aiheeseen liittyviä: Parhaat ilmaiset online -HTML -editorit koodisi testaamiseen
Jos vastaavaan syöttökenttään määritetty tunnus vastaa varten arvo -tunniste, tämä syöttökenttä korostuu automaattisesti, kun napsautat tunnistetta.
Tag Esimerkki
First Name:
Yllä olevasta esimerkistä näet, että varten attribuutille annetaan arvo fnimi . Siksi, jos luot syöttökentän näppäimellä fnimi id, tämä kenttä korostuu aina, kun napsautat Ensimmäinen Nimi etiketti.
Tunnisteen käyttäminen
Perusmuodossaan, tunniste voidaan nähdä tekstiruuduna. The tag kerää tietoja käyttäjältä ja yksi sen tärkeimmistä ominaisuuksista on tyyppi attribuutti. The tyyppi -attribuutti osoittaa, millaisia tietoja tämä tekstiruutu voi kerätä.
Aiheeseen liittyviä: Pinotun lomakkeen luominen CSS: ään
Voit liittää arvoon useita eri arvoja tyyppi ominaisuus, mutta jotkut suosituimmista ovat seuraavat.
- Teksti
- Määrä
- Sähköposti
- Kuva
- Päivämäärä
- Valintaruutu
- Radio
- Salasana
Käyttämällä tagia Esimerkki
First Name:
The yllä olevassa koodissa olevalla tunnisteella on kolme eri määritettä, joilla kullakin on oma toiminto. The tyyppi attribuutille on annettu tekstiarvo, mikä tarkoittaa, että tekstiruutu hyväksyy vain merkkejä.
The id attribuutti on tekstikentän yksilöllinen tunniste, ja se on tärkeä, koska se tarjoaa pääsyn tähän elementtiin CSS -tiedostosta. The nimi attribuutti on myös yksilöllinen tunniste; name-attribuuttia käytetään kuitenkin vuorovaikutuksessa kehityksen palvelinpuolen elementin kanssa.
The id ja nimi määritteille annetaan yleensä sama arvo, koska yksi antaa pääsyn elementtiin asiakaspuolelta ja toinen palvelinpuolelta.
Valintaruudun elementin käyttäminen
Valintaruutu -elementti on hyvin ainutlaatuinen verrattuna muihin elementteihin, joita voit käyttää tag. Sen avulla käyttäjä voi valita yhden tai useamman vaihtoehdon aiheeseen liittyvien valintojen luettelosta. Valintaruudut on helppo tunnistaa, koska niitä edustavat pienet neliöruudut, jotka sisältävät valintaruudun, kun ne on valittu.
Esimerkki valintaruudun elementistä
Programming Languages:
Java
JavaScript
Python
Yllä olevassa esimerkissä jokaisella valintaruudun elementillä on arvoattribuutti, ja tämä on tärkeää, koska se auttaa erottamaan kunkin valintaruudun vaihtoehdon kokoelmasta. Siksi, jos käyttäjä valitsee Java -vaihtoehdon yllä olevista vaihtoehdoista, tiedot heijastavat sitä.
Tunnisteen ja radioelementtien käyttö
The tunniste ja radioelementit ovat samankaltaisia siinä mielessä, että niiden avulla käyttäjä voi valita vain yhden arvon kerrallaan; siksi voidaan sanoa, että niillä on sama tehtävä. Ne ovat kuitenkin hyvin erilaisia ulkonäöltään.
Radioelementti on ulkonäöltään lähempänä valintaruudun elementtiä, mutta radioelementissä on ympyröitä neliöiden sijasta.
The -tunniste tuottaa pudotusvalikon, jonka avulla käyttäjä voi valita yhden arvon.
Esimerkki tunnisteesta ja radioelementistä
Sex:
Male
Female
Other
Positions Available:
value='Junior Developer'> Junior Developer
value='Mid-level Developer'> Mid-level Developer
value='Senior Developer'> Senior Developer
Päivämäärä -elementin käyttäminen
Päivämäärä -elementti tuottaa pienen tekstiruudun, joka luo kalenterin napsautettaessa. Käyttämällä Päivämäärä syöttötyypinä lomakkeissasi suojaa käyttäjää siltä, että käyttäjä voi syöttää väärän päivämäärän, mikä voi johtaa virheellisten tietojen keräämiseen.
Esimerkki päivämääräelementistä
Sähköposti- ja salasanaelementin käyttäminen
Kun kehittäjä antaa tyypin määritteelle joko sähköpostin tai salasanan arvot tunniste, ne tuottavat saman tekstikentän. Kuitenkin, kun aloitat näiden laatikoiden käytön, erot näkyvät.
Sähköpostiosa valvoo tekstikenttään syötettyjä tietoja ja varmistaa, että jokainen lähetys täyttää sähköpostiosoitteen vakiovaatimuksen; mikä tarkoittaa paikallista osaa, jota seuraa @ -merkki ja joka päättyy verkkotunnukseen.
Esimerkki sähköpostielementistä
Yllä olevassa esimerkissä esitellään uusi ominaisuus nimeltä paikanpitäjä , ja tämä attribuutti ottaa teksti -arvon, joka näkyy tekstiruudussa harmaana. Tätä tekstiä käytetään osoittamaan tiedot, jotka on tarkoitus sijoittaa tekstiruutuun yllä olevan esimerkin mukaisesti.
Salasanaelementti muuttaa merkit tähtiksi, kun niitä syötetään tekstiruutuun. Siksi, jos tietokoneesi näyttö on muiden nähtävissä, he eivät näe antamaasi salasanaa.
Esimerkki salasanaelementistä
Painikkeiden käyttö
Lomakkeessa on yleensä kahdenlaisia painikkeita. Ensimmäinen on Lähetä -painike, joka lähettää lomakkeeseen syötetyt tiedot action -määritteelle (joka sijaitsee < lomake> tag).
Esimerkki Lähetä -painikkeesta
Submit
Toinen lomakkeessa yleensä käytetty painikkeiden tyyppi on nollauspainike, joka tyhjentää tiedot lomakkeesta, jotta käyttäjä voi syöttää tuoreita tietoja. The tunnisteessa on tyyppi attribuutti, jota käytetään osoittamaan painikkeen toimintaa. Yllä olevassa esimerkissä tyyppi attribuutti on määrittää arvo Lähetä , siksi painike, jossa on tyyppi jonkin arvo nollaa käytetään lomakkeen nollaamiseen.
Esimerkki nollauspainikkeesta
Reset
Lomakkeen luominen
Jos haluat luoda yksinkertaisen lomakkeen HTML -muodossa, sinun on liitettävä kaikki edellä kohdassa a mainitut elementit tag.
Lomakkeen luominen Esimerkki
Forms
First Name:
Last Name:
Date of birth:
Age:
Gender:
Male
Female
Other
Email Address:
Positions Available:
value='Junior Developer'> Junior Developer
value='Mid-level Developer'> Mid-level Developer
value='Senior Developer'> Senior Developer
Programming Languages:
Java
JavaScript
Python
Password:
Confirm Password:
Submit
Reset
Yllä oleva koodi tuottaa seuraavan muodon:
kopioi cd: stä mp3: ksi kappaleiden nimillä
Nyt voit luoda yksinkertaisen lomakkeen HTML -muodossa
Tässä artikkelissa on kaikki työkalut toimivan HTML -lomakkeen luomiseen. Se tunnistaa eri HTML -tunnisteet, joita käytetään lomakkeiden luomisessa, ja tutkii eri määritteitä, joita voidaan käyttää näiden tunnisteiden kanssa.
Useimmilla verkkosivustoilla näkyvillä lomakkeilla on kuitenkin yksi lisäosa; CSS, jota käytetään tuomaan muoto eloon ja tekemään siitä esteettisesti miellyttävämpi.
Jaa Jaa Tweet Sähköposti Essential CSS3 Properties -huijausarkkiHallitse olennainen CSS -syntaksi CSS3 -ominaisuuksien huijausarkin avulla.
Lue seuraava Liittyvät aiheet- Ohjelmointi
- HTML
- Verkkokehitys
- Koodausoppaat
Kadeisha Kean on täyspinoinen ohjelmistokehittäjä ja tekninen/teknologinen kirjoittaja. Hänellä on selkeä kyky yksinkertaistaa joitain monimutkaisimpia teknologisia käsitteitä; tuottaa materiaalia, jonka jokainen tekniikan aloittelija voi helposti ymmärtää. Hän on intohimoinen kirjoittamiseen, mielenkiintoisten ohjelmistojen kehittämiseen ja matkustamiseen ympäri maailmaa (dokumenttielokuvien kautta).
Lisää Kadeisha Keaniltatilaa uutiskirjeemme
Liity uutiskirjeeseemme saadaksesi teknisiä vinkkejä, arvosteluja, ilmaisia e -kirjoja ja ainutlaatuisia tarjouksia!
Klikkaa tästä tilataksesi