En HTML Drop Down Menu Tutorial
Webskjemaer brukes på HTML-sider for å samle inn data fra besøkende. Skjemaer tillate flere typer input felt inkludert tekstbokser, radioknapper, avmerkingsbokser og rullegardinmenyer. Legg en HTML rullegardinmenyen til et webskjema for å tilby dine besøkende mange valg i en svært begrenset mengde plass. I motsetning til radio knapper eller sjekk boksene der alle alternativer er oppført på skjermen, HTML drop-down menyer normalt bare viser en alternativ og skjule resten. Et vanlig eksempel på en rullegardinmeny er statlig utvalg der en enkelt rullegardinmenyen kan holde navnene på alle femti stater.
Bruksanvisning
1 Lag rullegardinmenyen kroppen ved hjelp av "velg" tag. Begynn på rullegardinmenyen med <velg> og avslutte rullegardinmeny med </ velge>.
2 Velg navn, størrelse og flere innstillinger og inkludere disse inne i <velg> tag.
Den "navn" innstillingen holder navnet på rullegardinmenyen. Den "size" innstillingen kan du bestemme hvor mange menyvalg vises på skjermen. Standardstørrelsen er en, men du kan lage en rullegardinmeny som viser flere alternativer. Hvis "multiple" argument er satt, så brukeren kan velge flere alternativer fra rullegardinmenyen. La ut "flere" innstillingen for å lage en rullegardinmeny der brukere kan bare velge ett alternativ.
HTML <velg> koden følger dette formatet:
<Velg name = "dittnavn" size = 2 flere>
</ Velge>
I dette eksemplet er rullegardinmenyen som heter "dittnavn". Det vil vise to alternativer på skjermen, og besøkende vil være i stand til å velge flere alternativer.
Å lage en enkel rullegardinmeny der bare ett alternativ vises på skjermen, og brukere kan bare velge ett alternativ, bruker du følgende kode:
<Velg name = "dittnavn">
</ Velge>
I dette eksemplet er størrelsen og flere argumenter mangler så nedtrekksmenyen tar på standardegenskapene.
3 Definer alternativer for drop-down menyer. Begynn hvert alternativ med <alternativ> -kode, og avslutt hver og en med </ option> tag.
Den grunnleggende formatet er som følger:
<Option value = "yourvalue"> Grønn </ option>
Verdien sette navn mulighet for intern behandling. Opsjonsverdien vises ikke for nettstedet besøkende og brukes bare for webskjema behandling. De vedlagte mellom <option> og </ option> tags (i dette tilfellet ordet "grønn") ord vil vises på skjermen synlig for besøkende på nettstedet.
Ta med en alternativ kommando for hver rullegardinmenyen alternativet. Den siste rullegardin koden vil se slik ut:
<Velg name = "navn">
<Option value = "en"> Green Apples </ option>
<Option value = "to"> gule epler </ option>
<Option value = "tre"> Red Apples </ option>
<Option value = "fire"> Applesauce </ option>
</ Velge>
4 Gi klare instruksjoner ovenfor rullegardinmenyen, slik at nettstedet besøkende forstår hvilket alternativ du skal velge. Hvis innstillingen "multiple" er satt, instruere brukeren velge flere alternativer ved å klikke musen og trykke på "Ctrl" -knappen på samme tid.
5 Sett rullegardin kode i et webskjema på en HTML-side.
Bruk følgende oppsett:
<Html>
<Body>
<Form name = "sample_form" action = "http://www.your_domain_name.com/formprocessing.cgi" method = "POST">
<P> Velg din favoritt type eple fra rullegardinmenyen. </ P>
<Velg name = "navn">
<Option value = "en"> Green Apples </ option>
<Option value = "to"> gule epler </ option>
<Option value = "tre"> Red Apples </ option>
<Option value = "fire"> Applesauce </ option>
</ Velge>
</ Form>
</ Body>
</ Html>