从DOM数据元素动态构建select语句

Question

我需要根据提供ajax查询的表单数据动态构建选择下拉列表.我的DOM包含一个包含4个孩子的元素"组织".具有组织ID和组织名称的子项

Organizations = {
    { id="2", name="Systems"}
    { id="4", name="Network"}
    { id="5", name="Operations"}
    { id= "7", name="Security"}
}

我需要构建以下select子句

<select name='organization'>
    <option value="2">Systems</option>
    <option value="4">Network</option>
    <option value="5">Operations</option>
</select>

如何动态构建select语句？

Answer 1

Organizations = {
     { id="2", name="Systems"}
     { id="4", name="Network"}
     { id="5", name="Operations"}
     { id= "7", name="Security"}
}

鉴于上述对象：

var $el = $('<select></select>');  //create a new DOM Element with jQuery syntax
for (i in Organizations) { //iterate through the object and append options
  $el.append('<option value="' + Organizations[i]['id'] + '">' + Organizations[i]['name'] + '</option>');
}

然后将创建的元素附加到某处...

$('body').append($el);  //should work