Multi-selezionare le caselle sono realizzati con quasi lo stesso codice di caselle di selezione discesa, l'unica differenza di programmazione è l'aggiunta di un attributo "multiplo". L'elemento di modulo creato da questo codice è una scatola in cui è possibile scorrere verso il basso e selezionare più opzioni. È possibile creare un pulsante che deseleziona tutte le opzioni in una scatola di selezione multipla in jQuery. L ' "opzione: selezionato" selector in jQuery troverà tutte le opzioni selezionate, e aggiungendo "removeAttr (' selezionato ')" al selettore si deselezionare quelle opzioni.

istruzione

1 Aprire la pagina Web in un editor e controllare per il riferimento libreria jQuery, che si trova all'interno di "<script>" tag in entrambi la testa o piè di pagina del codice pagina. Aggiungere il riferimento se non si trova uno, quindi aggiungere un paio di "<script>" tag sotto il riferimento per tenere lo script si scriverà:

<Funzione di script:

<Script type = "text / javascript">

$ (Function () {

});

</ Script>

Scrivi il resto dello script all'interno delle parentesi graffe della funzione.

3 Trovare il nome ID del pulsante "Invia" nel codice HTML:

<Input type = "submit" value = "Clear Box" id = "clear" />

In questo esempio, il nome di ID è "chiaro".

4 Selezionare il pulsante "Invia" con il suo nome ID e aggiungere il "click ()" la funzione di innescare un evento click:

$ ( "# Chiaro"). Click (function () {

});

5 Aggiungere questa riga di codice all'interno del "click ()" la funzione:

$ ( "Opzione: selezionato"). RemoveAttr ( "selezionato");

Questo codice funziona solo su multi-selezionare le caselle create dal tag "<select>". Il "$ (" opzione: selezionato ")" Selettore cerca qualsiasi opzione nel multi-selezione che viene evidenziato e usa "removeAttr ()" per rimuovere ogni istanza dell'attributo "selezionato" dai "<option>" tag su la pagina.

6 Aggiungi "return false" alla fine del "click) (" la funzione di evitare che il pulsante "Invia" di inviare l'utente a una nuova pagina o il tentativo di inviare dati. Il tuo codice finale sarà simile a questa:

$ (Function () {

$ ( "# Chiaro"). Click (function () {

$("option:selected").removeAttr("selected");

return false;

});

});

Consigli e avvertenze

• Modificare ogni istanza di "selezionato" per "controllato" nello script e rimuovere "opzione" dal codice di selezione per utilizzare questo script per le caselle di controllo, invece di una casella di selezione multipla.