Установка выбранного атрибута для элемента option для реального использования jQuery - PullRequest
Новая
       22

Установка выбранного атрибута для элемента option для реального использования jQuery

6 голосов
/ 27 ноября 2010

Я создаю список выбора с элементами option в jQuery. Упрощенно это выглядит так: 

var sel = $("<select>");
$.each(data, function(i, v){
    $("<option>").attr({ "value": i }).html(v).appendTo(sel);
});

Тогда я хочу выбрать опцию. Обычно я бы сделал что-то вроде: 

$(sel).val(1);

Но тогда у опции нет выбранного атрибута.

$(sel).html() дает что-то вроде: 

<option value="1">1</option>
<option value="2">2</option>

и это то, что я ожидал: 

<option value="1" selected="selected">1</option>
<option value="2">2</option>

Я попробовал этот подход (тот же результат, что и при использовании .val ()): 

$.each(data, function(i, v){
    var attrs = { "value": i };
    if(i == 1){
        attrs.selected = "selected";
    }
    $("<option>").attr(attrs).html(v).appendTo(sel);
});

но единственный способ найти работу - это: 

$.each(data, function(i, v){
    var el = "<option>";
    if(i == 1){
        el = '<option selected="selected"></option>';
    }
    $(el).attr({ "value": i }).html(v).appendTo(sel);
});

Есть ли другой или лучший способ?

1 Ответ

9 голосов
/ 27 ноября 2010

Вы можете использовать нативный setAttribute() метод . Я считаю, что jQuery запутывает различие между атрибутами и свойствами.

Получает <option>, который вы хотите, по его индексу из <select> элементов options collection и устанавливает атрибут: 

sel[0].options[1].setAttribute('selected','selected');

Или это использует jQuery, чтобы сначала установить значение, затем возвращается и получает правильную опцию, используя native selectedIndex свойство . 

sel.val(1);
sel[0].options[sel[0].selectedIndex].setAttribute('selected','selected');

РЕДАКТИРОВАТЬ: Немного не по теме, но вы можете создать <option> элементы немного по-другому, как это: 

$("<option>",{
    value: i,
    html: v
}).appendTo(sel);

Начиная с jQuery 1.4, вы можете отправлять коллекцию значений, которые вы хотите установить для нового элемента.

...