Caselle a discesa consentono agli utenti di selezionare un'opzione in un modulo Web. Forme di elaborazione richiede alcuni di programmazione di fuori del codice HTML di base, ma jQuery è particolarmente adatto per la sfida. Utilizzando la funzione "Val ()", è possibile ottenere il valore di qualsiasi elemento di pagina selezionato. Scrivere una funzione che utilizza l'evento "click ()" per rendere la pagina Web di visualizzare un valore della casella a discesa o «selezione», quando l'utente fa clic su un pulsante "Invia".

Istruzioni

1

Aprire il codice in un editor come blocco note o Notepad + + e controllare tra i tag "< head >" e sopra la chiusura tag "< / body >" per un riferimento alla libreria jQuery. Se trovate in né luogo, aggiungere questo codice:

< script tag sotto quel codice. Tutto il codice jQuery andrà tra questi tag:

< script type = "text/javascript" >

< / script >

2

Scorrere verso il basso nel codice HTML e trovare i nomi di ID della casella a discesa, pulsante "Invia" e un elemento vuoto dove è possibile l'uscita il valore:

< forma >

< selezionare id = "elenco a discesa" >

<option value="1">Value 1</option>

< / selezionare >

< input type = "submit" value = "Ottieni il valore" id = "mysubmit" / >

< / form >

< div id = "valore" >< / div >

Nel codice di esempio precedente, l'ID della casella di elenco a discesa è "a tendina" mentre l'ID del pulsante "Invia" è "mysubmit." Il tag "< div >" alla fine hanno un ID di "valore", ed è possibile utilizzare un div come questo per l'output il valore di discesa.

3

Tornare allo script e avviare la funzione di "documento pronto":

$(function() () {

});

Posto il tuo intero script all'interno di questa funzione. Questo codice impedisce l'esecuzione fino a quando la pagina al termine del caricamento dello script.

4

Selezionare il pulsante "Invia" dal suo nome ID e aggiungere la funzione "click ()":

$("#mysubmit").click(function() () {

});

Modificare "mysubmit" con il nome di ID del pulsante "Invia". Aggiungere sempre i nomi di ID con un simbolo di cancelletto in jQuery selettori.

5

Dichiarare una variabile all'interno della funzione "click ()" e impostarla uguale a un selettore per la tua casella di elenco a discesa con la funzione di "Val ()" aggiunta:

selezione di var = $("#dropdown").val();

6

Selezionare l'elemento HTML vuota, ad esempio una coppia di tag "< div >", utilizzando il relativo nome ID. Aggiungere la funzione "Text" per questo selettore e passare la variabile come argomento:

$("#thevalue").text(selection);

7

Aggiungere "return false" alla fine della funzione "click ()" per impedire l'invio l'utente a un'altra pagina sul pulsante "Invia". Questo è lo script finale:

$(function() () {

$("#mysubmit).click(function() () {

var selection = $("#dropdown").val();

$("#thevalue").text(selection);

return false;

});

});