Hvordan bruke HTML til å fylle en ListBox av filnavn
Listboxes gi en praktisk måte for nettstedet eiere for å vise elementer, for eksempel filnavn, på en webside. Brukere vise en liste over navn som vises i en liste, og klikk de som de ønsker. HTML ikke har en kontroll som heter "listeboksen." Det gjør imidlertid, har en "velg" kontroll som viser rulle elementer. Ved å legge "størrelse" og "flere" parametre til denne kontrollen, kan du lage en listeboksen for HTML-websiden og fylle den med filnavn.
Bruksanvisning
1 Legg til følgende kode i HTML-dokumentet:
<Velg id = "ListBox1"> </ select>
<Input type = "button" value = "Legg filnavn" onclick = "addFileNames ( 'ListBox1')" />
Den første linjen oppretter en tom "velg" kontroll med en id av "ListBox1." Dens "flere" eiendom gjør at brukerne kan velge mer enn ett element om gangen ved å holde nede "Ctrl" -tasten når du klikker elementer. Den andre linjen skaper en knapp. At knappen har en "onclick" event som går listeboksen id verdi, "ListBox1," til en funksjon som fyller listeboksen.
2 Legg Java erklæring delen inne i dokumentet "<head>" -delen:
Var filnavn = [
"Filnavn1",
"Filnavn2",
"Filnavn3"
];
Dette skaper en rekke filnavn du vil bruke for å teste koden. Denne rekken, heter "filnavn", inneholder tre navn.
3 Kopier følgende Javascript-kode, og lim den inn under koden vist i forrige trinn:
funksjons addFileNames (listboxID) {
Var listeboksen = document.getElementById (listboxID);
for (var i = 0; i <filenames.length; i ++) {
Var listboxSize = listbox.options.length;
listbox.options [listboxSize] = new Option (filnavn [i], i);
}
Var listBoxSize = listbox.options.length;
listbox.size = listBoxSize;
}
Denne funksjonen looper gjennom "filnavn" array og legger hvert navn til listeboksen. De siste to linjer beregne størrelsen på listeboksen og utvider det slik at alle elementer vises.
4 Lagre dokumentet og vise den i en nettleser. Du vil se en tom listeboksen og knappen din. Klikk på knappen. Koden går og legger filnavnene til listeboksen. Klikk på et filnavn for å velge det. Hold nede "Ctrl" -tasten og klikk flere navn å velge mer enn én samtidig.
Hint
- Legg til flere filnavn som trengs for å Javascript matrise ved å opprette flere array elementer. For eksempel, for å legge til en annen filnavn som heter "Filename4," føyer den til bunnen av listen over eksisterende navn i "filnavn" array.