Thêm tùy chọn trống để đầu lựa chọn và làm cho nó trở thành lựa chọn được chọn trong 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>"); 

Khi tôi chạy này trong FireFox hoặc Chrome, thả xuống có đã chọn tùy chọn trống mới được chèn. Khi tôi chạy nó trong IE8, nó vẫn có Volvo được chọn. Bất kỳ ý tưởng?

http://jsfiddle.net/YFu2h/

Answer 1

Thay đổi nó điều này, và nó sẽ làm việc:

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

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

dường như IE chỉ đánh giá các thuộc tính selected khi nó lần đầu tiên gặp các select.

Answer 2

Hãy thử:

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

Hoặc, nếu bạn thích:

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

Sử dụng tùy chọn đầu tiên là nhẹ nhanh hơn. Các dấu ngoặc kép trống có nghĩa là giá trị trống và văn bản trống, vì vậy hãy điền chúng vào khi bạn cần. Bạn không cần thuộc tính đã chọn trong phần thêm vào bây giờ chúng tôi sẽ thêm chúng sau đó. Đó là một cái gì đó để làm với internet explorer không công nhận nó đang được đánh dấu là lựa chọn vì nó chỉ mới được tạo ra.

Answer 3

Tôi không chắc chắn lý do tại sao mã của bạn không hoạt động (có thể nó có cái gì để làm với thực tế là trong IE, selectedIndex là chỉ đọc), nhưng làm việc này trong IE:

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