Как использовать jQuery, чтобы выбрать опцию раскрывающегося списка?

Мне было интересно, можно ли заставить jQuery выбрать <option>, скажем, 4-й элемент, в выпадающем списке?

<select>
    <option></option>
    <option></option>
    <option></option>
    <option></option>
    <option></option>
</select>

Я хочу, чтобы пользователь щелкнул ссылку, а затем поле <select> изменило его значение, как если бы пользователь выбрал его, щелкнув по <option>.

Ответ 1

Как насчет

$('select>option:eq(3)').attr('selected', true);

пример http://www.jsfiddle.net/gaby/CWvwn/

для современных версий jquery вы должны использовать .prop() вместо .attr()

$('select>option:eq(3)').prop('selected', true);

пример http://jsfiddle.net/gaby/CWvwn/1763/

Ответ 2

Решение:

$("#element-id").val('the value of the option');

Ответ 3

Элементы выбора HTML имеют свойство selectedIndex, которое можно записать, чтобы выбрать конкретную опцию:

$('select').prop('selectedIndex', 3); // select 4th option

Используя простой JavaScript, это может быть достигнуто с помощью:

// use first select element
var el = document.getElementsByTagName('select')[0]; 
// assuming el is not null, select 4th option
el.selectedIndex = 3;

Ответ 4

Я бы сделал это таким образом

 $("#idElement").val('optionValue').trigger('change');

Ответ 5

Самый простой способ - val(value):

$('select').val(2);

И чтобы получить выбранное значение, вы не дадите никаких аргументов:

$('select').val();

Кроме того, если у вас есть <option value="valueToSelect">...</option>, вы можете сделать:

$('select').val("valueToSelect");

DEMO

Ответ 6

Если ваши параметры имеют значение, вы можете сделать это:

$('select').val("the-value-of-the-option-you-want-to-select");

'select' будет идентификатором вашего выбора или селектора классов. или если есть только один выбор, вы можете использовать тег, как в примере.

Ответ 7

Используйте следующий код, если вы хотите выбрать опцию с определенным значением:

$('select>option[value="' + value + '"]').prop('selected', true);

Ответ 8

Я предпочитаю nth-child() для eq(), поскольку он использует индексирование на основе 1, а не 0, что немного легче для моего мозга.

//selects the 2nd option
$('select>option:nth-child(2)').attr('selected', true);

Ответ 9

С элементом '' обычно мы используем атрибут value. Это упростит настройку:

$('select').val('option-value');

Ответ 10

Попробуйте следующее:

$('#mySelectElement option')[0].selected = true;

Привет!

Ответ 11

 Try with the below codes. All should work. 
    $('select').val(2);
    $('select').prop('selectedIndex', 1);
    $('select>option[value="5"]').prop('selected', true);
    $('select>option:eq(3)').attr('selected', 'selected');
    $("select option:contains(COMMERCIAL)").attr('selected', true);

Ответ 12

ответ с id:

$('#selectBoxId').find('option:eq(0)').attr('selected', true);

Ответ 13

 $('select>option:eq(3)').attr('selected', 'selected');

Одно предупреждение здесь, если у вас есть просмотр javascript для события выбора варианта/варианта, вам нужно добавить .trigger('change'), чтобы код стал.

 $('select>option:eq(3)').attr('selected', 'selected').trigger('change');

поскольку только вызов .attr('selected', 'selected') не вызывает событие