Cài đặt giá trị chọn không ảnh hưởng đến việc sử dụng bàn phím

Question

Tôi có lựa chọn với f.e. 10 tùy chọn ('một', 'hai', 'ba', ...). Tải trang tùy chọn đầu tiên 'một' được chọn.

Trong vòng một chức năng tôi thiết lập để lựa chọn thứ năm

$("myselect").val('five'); 

Trong thực tế hiện nay phần năm tùy chọn được hiển thị trong lựa chọn và giá trị cũng được thiết lập chính xác.

Nhưng bây giờ tôi tab trên biểu mẫu của tôi cho đến khi tôi đạt được lựa chọn này. Và nếu bây giờ tôi sử dụng phím xuống bàn phím, chọn nhảy đến tùy chọn 'hai' và không phải 'sáu'.

Làm cách nào để đặt tùy chọn đã chọn cũng hoạt động cho việc sử dụng bàn phím sau này?

Answer 1

Thử đặt thuộc tính selectedIndex. Xem dưới đây,

$('#myselect').val("5").prop('selectedIndex', 4); 

DEMO:http://jsfiddle.net/kLZ7z/

Một cách tiếp cận tốt hơn sạch hơn là

var nValue = "5"; 
$('option', '#myselect').filter(function() {   
    return this.value == nValue; 
}).prop('selected', true); 

DEMO:http://jsfiddle.net/kLZ7z/2/

Answer 2

đoán một chút, nhưng cố gắng này:

$('#myselect option').each(function(){ 
    $(this).removeAttr('selected')); 
}); 
$('#myselect option').eq(4).attr('selected', 'selected'); 

Đó là một chút chưa được kiểm tra giả mã, chỉ cần cung cấp cho bạn một ý tưởng về những gì để thử.

Answer 3

Đây là một lỗi Firefox. Một giải pháp tôi tìm thấy là sử dụng .prop('selected', true) trên tùy chọn, thay vì sử dụng .val trên lựa chọn.

$('#myselect').children('option[value="five"]').prop('selected', true); 

DEMO: http://jsfiddle.net/JM2dZ/1/

LƯU Ý: Bạn không cần phải bỏ đặt selected vào các tùy chọn khác đầu tiên, làm như vậy thực sự sẽ gây ra vấn đề để tiếp tục xảy ra.