2013-03-16 14 views
5

Come posso gestire l'evento di compressione di una selezione o attivare l'evento di modifica anche se l'opzione selezionata non è cambiata?jQuery seleziona change event quando si seleziona lo stesso valore

Ho bisogno di avere questo per un motore di ricerca, in cui la mascotte si muoverà ancora se l'opzione che è stata selezionata è la stessa. Il motore di ricerca si trova in questa pagina: http://www.marocpneus.com

Ad esempio, se si va avanti e si fa clic sulla prima selezione di "Tipo di veicolo" e si seleziona "Turismo" che era già selezionato, il personaggio non passerà alla seconda selezione . Tuttavia, se cambi "Turismo" con uno degli altri valori, il personaggio si muoverà effettivamente usando il classico evento di cambio jQuery.

+0

Non credo che ci sia un evento 'collasso' (o equivalente). Ma mi piacerebbe essere smentito. –

+1

L'evento change viene attivato solo se il valore cambia, probabilmente dovresti attivare un evento personalizzato o utilizzare l'evento click sulle opzioni ecc. – adeneo

+1

@adeneo il clic sulle opzioni non funzionerà per me. Sto usando questo codice per testarlo ma non si innescherà: $ ('seleziona l'opzione'). Click (function() {console.log ("CLICKED")}); Potete fornire un esempio per favore? –

risposta

8

Ok, dopo alcune ricerche, sembra che selezionare clik opzione non può stato licenziato a causa di browser incomptability (guardare questa domanda SO: Event attached to Option node not being fired)

... ma siamo in grado di simulare il click, per fare una soluzione alternativa, XD, avete il violino qui: http://jsfiddle.net/H9gg5/3

Js

$('select.click_option').click(function() { 
    if ($(this).data('clicks') == 1) { 
     // Trigger here your function:  
     console.log('Selected Option: ' + $(this).val()); 
     $(this).data('clicks', 0); 
    } else { 
     console.log('first click'); 
     $(this).data('clicks', 1); 
    } 
}); 

$('select.click_option').focusout(function() { 
    $(this).data('clicks', 0); 
}); 

Html

<select class="click_option"> 
     <option value="1"> Selected 1 </option> 
     <option value="2"> Selected 2 </option> 
</select> 

Cosa fa? Bene, sappiamo che abbiamo selezionato un'opzione (anche la stessa opzione) perché clicchiamo due volte sopra la selezione, quindi, contiamo solo il numero di clic, e quando arriva dopo un clic precedente, attivalo, XD. Il codice gestisce anche la perdita di messa a fuoco, perché se si fa clic fuori dalla selezione, si chiuderà con i clic = 1 e sarà necessario ripristinarlo.

Ho aggiunto una classe alla selezione, per attivare solo la funzione quando l'utente fa clic sulla selezione desiderata.

Spero che aiuti, saluti!

+0

Grazie - buon metodo per aggirare questo problema. –

Problemi correlati