使用追加后错误在选择框中设置选定值

Question

我有一个Dropbox

<select name="product">
<option value="">Select a product</option>
<option value="1">iPhone</option>
</select>

我的剧本

$('select[name=product]').append("<option value='2'>Samsung</option>").prop('selected', true);

这是我的结果

<select name="product">
<option value="">Select a product</option>
<option value="1">iPhone</option>
<option value="2">Samsung</option>
</select>

如何修复

<select name="product">
<option value="">Select a product</option>
<option value="1">iPhone</option>
<option value="2" selected="selected">Samsung</option>
</select>

Answer 1

直接添加selected属性更容易：

$('select[name=product]').append("<option value='2' selected>Samsung</option>");

<强> DEMO

Answer 2

jQuery链接返回初始select对象，但不返回附加的option。

您的代码与：

相同

var o = $('select[name=product]');
o.append('<option/>');
o.prop('selected', true); // not on option, but on select

将语法更改为以下内容：

$("<option value='2'>Samsung</option>")
    .appendTo('select[name=product]')
    .prop('selected', true);

Answer 3

您需要更改选项的选定属性。

试？

$('select[name=product]').append("<option value='2' selected=SELECTED>Samsung</option>");

Answer 4

这很容易。你可以这样做。

$('select[name=product]').append("<option value='2'>Samsung</option>");
$('select[name=product] option:last').attr('selected', 'selected');