Đặt chỉ mục được chọn của Dropdown bằng jQuery

Làm cách nào để đặt chỉ mục thả xuống trong jQuery nếu cách tôi tìm điều khiển như sau:

$("*[id$='" + originalId + "']") 

Tôi làm theo cách này vì tôi đang tạo các điều khiển một cách linh hoạt và vì các id được thay đổi khi sử dụng Biểu mẫu web, tôi thấy đây là một công việc xung quanh để tìm cho tôi một số điều khiển. Nhưng một khi tôi có đối tượng jQuery, tôi không biết cách đặt chỉ mục được chọn thành 0 (không).

Trước hết - bộ chọn đó khá chậm. Nó sẽ quét mọi phần tử DOM để tìm id. Nó sẽ ít thành công hơn nếu bạn có thể gán một lớp cho phần tử.

$(".myselect")

Để trả lời câu hỏi của bạn, có một số cách để thay đổi giá trị phần tử được chọn trong jQuery

// sets selected index of a select box to the option with the value "0"
$("select#elem").val('0'); 

// sets selected index of a select box to the option with the value ""
$("select#elem").val(''); 

// sets selected index to first item using the DOM
$("select#elem")[0].selectedIndex = 0;

// sets selected index to first item using jQuery (can work on multiple elements)
$("select#elem").prop('selectedIndex', 0);

Chỉ cần tìm thấy điều này, nó hoạt động cho tôi và cá nhân tôi thấy nó dễ đọc hơn.

Điều này sẽ đặt chỉ mục thực tế giống như tùy chọn câu trả lời số 3 của gnarf.

// sets selected index of a select box the actual index of 0 
$("select#elem").attr('selectedIndex', 0);

Điều này đã không được sử dụng để làm việc nhưng hiện tại ... thấy lỗi: http://dev.jquery.com/ticket/1474

Phụ lục

Theo khuyến cáo trong các ý kiến ​​sử dụng:

$("select#elem").prop('selectedIndex', 0);

Tôi đang viết câu trả lời này vào năm 2015 và vì một số lý do (có thể là các phiên bản cũ hơn của jQuery), không có câu trả lời nào khác phù hợp với tôi. Ý tôi là, họ thay đổi chỉ mục đã chọn, nhưng nó không thực sự phản ánh về việc thả xuống thực tế.

Đây là một cách khác để thay đổi chỉ mục và thực sự có nó phản ánh trong danh sách thả xuống:

$('#mydropdown').val('first').change();

Tôi đang sử dụng

$('#elem').val('xyz');

để chọn phần tử tùy chọn có value = 'xyz'

Mã JQuery:

$("#sel_status").prop('selectedIndex',1);

Mã Jsp:

Status:
<select name="sel_status"
    id="sel_status">
    <option value="1">-Status-</option>
    <option>ALL</option>
    <option>SENT</option>
    <option>RECEIVED</option>
    <option>DEACTIVE</option>
</select>

Bạn muốn lấy giá trị của tùy chọn đầu tiên trong phần tử chọn.

$("*[id$='" + originalId + "']").val($("*[id$='" + originalId + "'] option:first").attr('value'));

Để chọn tùy chọn thứ 2

$('#your-select-box-id :nth-child(2)').prop('selected', true);

Ở đây chúng ta thêm `kích hoạt ('thay đổi') để tạo ra sự kiện.

$('#your-select-box-id :nth-child(2)').prop('selected', true).trigger('change');

$("[id$='" + originalId + "']").val("0 index value");

sẽ đặt thành 0

Chọn tùy chọn thứ 4

$('#select').val($('#select option').eq(3).val());

ví dụ trên jsfiddle