如何使用jQuery,JavaScript和HTML动态设置下拉列表的选定选项？

出于某种原因,我不能让这个工作.

我的选项列表使用以下脚本动态填充：

function addOption(selectId,value,text,selected) {
    var html = '<option value="'+value+'">'+text+'</option>';
    if (selected == "on") {
        html = '<option value="'+value+'" selected="selected">'+text+'</option>';
    }
    $('#'+selectId).append(html);
}

function addSalespersonoption(id,name,defsales) {
    addOption('salesperson',id,defsales);
}

这是HTML：

<td class="text-r"><label for="salesperson">Salesperson:</label></td>
<td>
    <select id="salesperson">
        <option value="">(select)</option>
    </select>
</td>

到目前为止,输出是：

<option value="1266852143634" selected="selected">Eric Hunt</option>

DOM显示了这个：

index              2
disabled           false
value              "1266852143634"
text               "Eric Hunt"
selected           false
defaultSelected    true

但由于某种原因,当页面加载时,下拉列表不会显示Eric Hunt为预选.这件事也没有.

如何获得“选择为真”而不是“defaultSelected true”？

编辑：事实证明,由于deceze和rosscj2533的答案的帮助,上面的代码完美地工作.它不适合我的唯一原因是,我发现Ruby代码覆盖了select元素.

感谢大家的帮助,

干杯

解决方法

defaultSelected属性不可设置,仅供参考：

Quote：

The defaultSelected property returns the default value of the selected attribute.
This property returns true if an option is selected by default,otherwise it returns false.

我想你想要：

$('option[value=valuetoSelect]',newOption).attr('selected','selected');

即设置要选择的选项的选定属性.

在不尝试修复代码的情况下,我大致会这样做：

function buildSelect(options,default) {
    // assume options = { value1 : 'Name 1',value2 : 'Name 2',... }
    //        default = 'value1'

    var $select = $('<select></select>');
    var $option;

    for (var val in options) {
        $option = $('<option value="' + val + '">' + options[val] + '</option>');
        if (val == default) {
            $option.attr('selected','selected');
        }
        $select.append($option);
    }

    return $select;
}

你似乎已经有很多行李和依赖,我无法告诉你如何最好地将选定的选项集成到你的代码中而不会看到更多,但希望这会有所帮助.

原文地址：https://www.jb51.cc/jquery/178941.html