Question

我正在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);
});

还有其他或更好的方法吗？

Answer 1

您可以使用native setAttribute() method。我相信jQuery会混淆属性和属性之间的区别。

这会从<select>元素的options collection中获取其所需的<option>，并设置属性：

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

或者这使用jQuery首先设置值，然后使用native selectedIndex property返回并获取正确的选项。

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

编辑：偏离主题一点，但您可以像这样创建<option>元素：

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

从jQuery 1.4开始，您可以发送一组要为新元素设置的值。

使用jQuery在option元素上设置selected属性

1 个答案: