Aggiungi opzione vuota alla cima di selezionare e rendere l'opzione selezionata in IE

Question

HTML:

<select id="dropdown"> 
    <option value="volvo">Volvo</option> 
    <option value="saab">Saab</option> 
    <option value="mercedes">Mercedes</option> 
    <option value="audi">Audi</option> 
</select> 

jQuery:

$("#dropdown").prepend("<option value='' selected='selected'></option>"); 

Quando ho eseguito questo in Firefox o Chrome, il calo ha giù per la opzione vuota appena inserita selezionata. Quando lo eseguo su IE8, Volvo lo ha ancora selezionato. Qualche idea?

http://jsfiddle.net/YFu2h/

Answer 1

Modificarlo a questo, e funzionerà:

$("#theSelectId").prepend("<option value=''></option>").val(''); 

http://jsfiddle.net/YFu2h/1/

sembra che IE valuta solo l'attributo selected quando incontra prima il select.

Answer 2

Prova:

$("#dropdown").prepend(new Option('', '', true, true)); 
$("#dropdown option:first").attr("selected", "selected"); 

O, se si preferisce:

$("#dropdown").prepend("<option value=''></option>"); 
$("#dropdown option:first").attr("selected", "selected"); 

utilizzando la prima opzione è marginalmente più veloce. Le virgolette vuote indicano un valore vuoto e un testo vuoto, quindi inseriscile come ti serve. Non è necessario l'attributo selezionato in precedenza, ora li stiamo aggiungendo in seguito. È qualcosa che ha a che fare con Internet Explorer che non riconosce che viene contrassegnato come selezionato poiché è stato appena creato.

Answer 3

io non so perché il codice non funziona (forse ha qualcosa a che fare con il fatto che in IE, selectedIndex è di sola lettura), ma, facendo questo funziona in IE:

$("#dropdown").prepend("<option value='' selected='selected'></option>"); 
$("#dropdown")[0].options[0].selected = true;