Nwlapcug.com


Come collegare un pulsante HTML con una casella a discesa

I visitatori del sito di solito clic su caselle di riepilogo per aprirli. Gli sviluppatori posizionare questi controlli compatti, noto anche come selezionare caselle, nelle pagine Web per risparmiare spazio. Fino a quando un utente fa clic su una casella a discesa, occupa solo una riga in una pagina Web, anche se può contenere centinaia di elementi. Se desideri dare agli utenti la possibilità di aprire e chiudere una casella di riepilogo utilizzando un pulsante HTML, link questi due controlli utilizzando una funzione JavaScript.

Istruzioni

1

Lanciare un editor HTML o qualsiasi editor di testo e aprire uno dei documenti HTML.

2

Aggiungere il codice riportato di seguito alla sezione body del documento:

< selezionare id = "dropDownBox1" >

< opzione > A < / option >

l'opzione < B > < / option >

< opzione > C < / option >

< opzione > D < / option >

< / selezionare >

< input type = valore "pulsante" = "Open Drop Down" onclick = "openDropdown ('dropDownBox1', '3')" / >

Questo codice crea una casella di elenco a discesa e un pulsante. Quando si sceglie il pulsante, chiama una funzione JavaScript denominata openDropdown. Il pulsante passa anche il valore di id della casella a discesa alla funzione insieme al numero 3.

3

Sezione head del documento, aggiungere il seguente codice JavaScript:

Function () {openDropdown (elenco a discesa, size)

var dropDownObject = document.getElementById(dropDown);

dropDownObject.size = dimensione;

}

Questa funzione - chiamata dal pulsante..--ottiene un riferimento alla casella di elenco a discesa e imposta il valore di dimensione la dimensione passata alla funzione nell'elenco degli argomenti.

4

Salvare il documento e avviare il browser. Aprire il documento nel browser. La casella a discesa viene visualizzato sopra il pulsante nella pagina Web.

5

Fare clic sul pulsante. Il codice viene eseguito e apre automaticamente la casella a discesa.

Consigli & Avvertenze

  • Si noti che evento click del pulsante passa il numero 3 alla funzione JavaScript, anche se esistono quattro elementi nella casella a discesa. Quando si chiama la funzione in una pagina Web vera e propria, è possibile passare qualsiasi valore che ti piace. Non è necessario passare un valore che è uguale al numero di elementi nella casella di elenco a discesa. Si potrebbe anche aggiungere un altro pulsante che chiude la casella a discesa quando cliccato. Creare un pulsante duplicando il codice del pulsante descritto nei passaggi precedenti e passaggio di zero alla funzione JavaScript invece di 3.