Javascript for "Hvis da" uttalelser med rullemeny alternativer

Javascript for "Hvis da" uttalelser med rullemeny alternativer


Ved hjelp av Javascript-funksjoner, kan utviklere håndtere ulike aspekter av innholdet på websiden. Hvis du har et webskjema med drop-down lister i det, kan du gjenkjenne og kontrollere egenskapene til disse elementene i Javascript. Ved å ringe Javascript-funksjoner på brukermedvirkning, kan du opprette sider som er dynamisk og engasjerende. "Hvis da" uttalelser i Java uttrykkes ved hjelp av betinget tester, som du kan gjennomføre i forbindelse med HTML velger elementet.

Velg Kontroll

Webskjemaer bruker en rekke brukerkontroller inkludert tekstfelt, knapper, radioknapper, avmerkingsbokser og rullegardinlister. Den nedtrekkslisten i HTML er oppnådd ved hjelp av utvalgs og opsjoner elementer. Følgende eksempel HTML markup-kode demonstrerer:

<Velg id = "dyr">
<Option value = "cat"> Cat </ option>
<Option value = "hund"> ​​Dog </ option>
<Option value = "mus"> Mus </ option>
</ Velge>

Denne koden skaper en rullegardinliste med tre alternativer. Verdien attributtet brukes ofte som en identifikator innenfor både klient og server side skript. Innholdet i hver opsjonselementet vises mellom dets åpning og lukking koder. Innholdet er hva brukeren vil se når de klikker på valgkontrollen for å vise alternativene.

Javascript-funksjonen

For å bruke en Javascript-funksjon med utvalgte og opsjonselementer, kan utviklere enten inneholde en lenke til en egen script fil eller manuset selv i hodet delen av websiden. Følgende eksempelkode demonstrerer skape en seksjon for Javascript-kode med en funksjon disposisjon inni den:
<Script type = "text / javascript">
funksjon selectControl () {
// Funksjon implementering
}
</ Script>

Inne i funksjon, kan utvikleren inkludere noen behandling som er nødvendig for å velge kontrollen. I kroppen delen av siden, kaller følgende knapp kode funksjonen på brukermedvirkning:
<Input type = "button" value = "Velg kontroll" onclick = "selectControl ()" />

Når brukeren klikker på denne knappen, vil innholdet av funksjonen utføre.

Velg alternativer

Inne Javascript-funksjonen, kan utvikleren inkludere noen behandling er nødvendig for funksjonaliteten på siden. Følgende eksempelJavaScript-koden demonstrerer hente velge element alternativene som en matrise objekt:
Var optionsArray = document.getElementById ( "dyr") alternativer.;

Denne koden får først en referanse til HTML velger element ved hjelp av ID-attributtet, deretter tilbake alternativene for den aktuelle velger element, lagre dem som en matrise variabel. Funksjonen kan sløyfe gjennom opsjonselementer som følger:
Var opt;
for (opt = 0; opt <optionsArray.length; velge ++) {
alert (optionsArray [opt] .Value);
}

For demonstrasjon, utganger denne sløyfen verdien av hvert alternativ igjen, ved hjelp av sin verdi attributtet.

Betinget

Javascript-kode kan bruke kontrollstrukturer som conditionals å behandle innholdet av utvalgte og opsjonselementer. Følgende eksempelkode demonstrerer en betingelsestest av lengden på hver verdi opsjon elementattributtet, inne i loopen:
Var optLen = optionsArray [opt] .value.length;
if (optLen> 3) alert (optLen);

Denne koden kjøper første lengden av den aktuelle alternativ element verdiattributt som et tall variabel. Deretter koden tester det i en if setning, skrive ut et varsel dialogen bare hvis lengden er større enn tre.