jQuery使用循环创建选择选项

我正在尝试使用jquery创建选择框，但是链接会随机填充，所以我需要通过链接循环并抓住它来创建选择框，这是我的代码。如何使用速记/循环？谢谢

HTML:

JS:

$.fn.populate=function（）{
var option1=$（'pa:eq（0）'）。text（）；
var option2=$（'pa:eq（1）'）.text（）；
var option3=$（'pa:eq（2）'）.text（）；
$（本）
.附加（“”+选项1+“”）
.附加（“”+选项2+“”）
.附加（“”+选项3+“”）
}
$（“#选择”）.populate（）；

var$this=$（this）；
$（'PA'）。每个（函数（）{
$this.append（“”+$（this.text（）+“”）；
});

---

无需函数，除非您计划将其用于服务器下拉列表

var ddl = $("#select");

$("p a").each(function () {
    var link = $(this);
    ddl.append($("<option></option>").val(link.text()).html(link.text()));
});

var ddl=$（“#选择”）；
$（“PA”）。每个（功能）{
var-link=$（这个）；
ddl.append（$（“”）.val（link.text（））.html（link.text（））；
});

var-selectbox=$（“#选择”）//缓存我们的slectbox，这样jquery就不必在每个循环中查找它。
$（'p>a'）。每个（函数（）{//选择p中的所有a标记（循环）
var text=$（this）.text（）；//将链接文本缓存在变量中，因为我们需要它两次。
selectbox.append（$（''）.text（text）.val（text））；//向selectbox添加带有文本值的新选项
})

使元素中的循环使用

---

您不需要扩展jQuery，除非您想使其可重用

$.fn.populate=函数（el）{
var选项=“”；
$（el）。每个功能（即，e）{
选项+=''+$（this）.text（）+''；
});
这个。附加（选项）；
归还这个；
}
$（'#select'）。填充（'p>a'）；

A更干净、更面向jQuery的解决方案James Montagne的答案：

$this.append( $('<option/>').val('').text($(this).text()) );

$this.append（$（''）.val（''）.text（$（this.text（））；

或者使用属性映射的替代方案：

$this.append($("<option/>", {
    value: '',
    text: $(this).text()
}));

$this.append（$（“”）{
值：“”，
text:$（this.text（））
}));

$（“#新组织”）。单击（loadOrgTypes）；
函数loadOrgTypes（）{
log（“检索所有组织类型”）；
$.ajax({
键入：“GET”，
url:rootURL+“组织类型”，
数据类型：“json”，//响应的数据类型
成功：渲染器类型，
错误：函数（err）{
console.log（'Error'）；
log（“请求中的AJAX错误：+JSON.stringify（err，null，2））；
}
});
}
函数renderrorgtypes（数据）{
var list=data==null？[]：（数组的数据实例？数据：[data]）；
变量选择=$（“#组织类型#选择”）；
select.empty（）；
$.each（列表、功能（索引、组织类型）{
var content=''+org\u types.name\u loc+''；
选择。追加（内容）；
});
}

var ddl = $("#select");

$("p a").each(function () {
    var link = $(this);
    ddl.append($("<option></option>").val(link.text()).html(link.text()));
});

var selectbox=$("#select");//cache our slectbox, so jquery doesn't have to look for it in every loop.

$('p > a').each(function(){//select all a tags in p (loop through them)
    var text=$(this).text();//cache the link text in a variable because we need it twice.
    selectbox.append($('<option>').text(text).val(text));//add new option with value en text to selectbox
})

$.fn.populate = function(el) {
    var options = '';
    $(el).each(function(i, e) {
       options += '<option>' + $(this).text() + '</option>'; 
    });
    this.append(options);
    return this;
}

$('#select').populate('p > a');

$this.append( $('<option/>').val('').text($(this).text()) );

$this.append($("<option/>", {
    value: '',
    text: $(this).text()
}));

$('#new_organizations').click(loadOrgTypes);

function loadOrgTypes() {

  console.log('retrieving all Org Types');
  $.ajax({
    type: 'GET',
    url: rootURL+'org_types',
    dataType: "json", // data type of response
    success: renderOrgTypes,

     error: function(err){
       console.log('Error');
       console.log("AJAX error in request: " + JSON.stringify(err, null, 2));
                        }

  });
}


function renderOrgTypes(data){
 var list = data == null ? [] : (data instanceof Array ? data : [data]);

 var select = $("#org_types_select");
    select.empty();

 $.each(list , function(index, org_types) {
            var content='<option org_type_id="' + org_types.id + '">' + org_types.name_loc + '</option>';
            select.append(content);

 });
}