jQueryを使用して実際にoption要素に選択した属性を設定する

Question

jQueryにオプション要素を含む選択リストを生成しています。簡体字は次のようになります。

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

次に、オプションを選択します。通常、私は次のようなことをします：

$(sel).val(1); 

しかし、オプションには選択された属性がありません。

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

私は（）（.val使用するのと同じ結果を）このアプローチを試してみました：

$(sel).html()のようなものが得られます。

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

を、これは私が期待したものである

$.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); 
}); 

他にも良い方法がありますか？

Answer 1

native setAttribute() methodを使用できます。私はjQueryが属性とプロパティの区別を混乱させていると思います。

これは<option>あなたが<select>要素のoptions collectionからそのインデックスで欲しい、と属性を設定します取得します。

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

それともこれは、最初の値を設定するためにjQueryのを使用して、その後戻って使用して正しいオプションを取得しますnative selectedIndex property。

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

---

EDIT：トピックオフ少し、しかし、あなたは少し違った。このような<option>要素作成することができます：jQueryの1.4以来

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

を、あなたは、値のコレクションを送ることができます新しい要素を設定します。