javascript - 通过循环对象数组来填充下拉列表

Question

http://jsfiddle.net/5m86J/6/

returnLOB =[
    {
        id: 1,
        name:"CIB"
    },
    {
        id: 2,
        name:"GTI"
    }
]

上面是对象数组。我需要使用数组中的选项填充下面的下拉列表。

<div id="LOBSelect" class="clearfix displayOnCreate">
    <span class="label">Dropdown</span>
    <select name="lob-select" class="dk" id="lobSelect"></select>
</div>

以下循环仅生成带有选项表单对象 [GTI] 的下拉列表，而不是第一个。 谁能告诉我这里出了什么问题吗？

for (var j = 0; j < returnLOB.length; j++){
    $('#LOBSelect').find('select[name="lob-select"]').html($('<option/>', {
        value: returnLOB[j].name,
        text: returnLOB[j].name,
        id: returnLOB[j].id
    }));
}

Answer 1

您需要使用.append()而不是 .html()

Insert content, specified by the parameter, to the end of each element in the set of matched elements.

代码

$('#LOBSelect').find('select[name="lob-select"]').append($('<option/>', {
    value: returnLOB[j].name,
    text: returnLOB[j].name,
    id: returnLOB[j].id
}));

DEMO