jQuery获取值并插入到下拉菜单中，然后添加url作为选项值

我有以下自动生成的代码，我希望jQuery代码帮助我取出div中的值并添加到下拉菜单中，并添加“/listing agent staff/barack obama”作为选项值

自动生成的代码：

<div class="StaffName">Barack Obama</div>
<div class="StaffName">Bill Clinton</div>
<div class="StaffName">Will Smith</div>

<label for="Listing_Agent_Staff">Listing Contact</label>
<select name="Listing_Agent_Staff" id="Listing_Agent_Staff" class="cat_dropdown">
<option value="">-- Please select --</option>
<option value="/listing-agent-staff/barack-obama">Barack Obama</option>
<option value="/listing-agent-staff/bill-clinton">Bill Clinton</option>
<option value="/listing-agent-staff/will-smith">Will Smith</option>
</select>

巴拉克·奥巴马 比尔·克林顿 威尔·史密斯 我希望插入值的下拉菜单：

<div class="StaffName">Barack Obama</div>
<div class="StaffName">Bill Clinton</div>
<div class="StaffName">Will Smith</div>

<label for="Listing_Agent_Staff">Listing Contact</label>
<select name="Listing_Agent_Staff" id="Listing_Agent_Staff" class="cat_dropdown">
<option value="">-- Please select --</option>
<option value="/listing-agent-staff/barack-obama">Barack Obama</option>
<option value="/listing-agent-staff/bill-clinton">Bill Clinton</option>
<option value="/listing-agent-staff/will-smith">Will Smith</option>
</select>

列出联系人
--请选择--
巴拉克·奥巴马
比尔·克林顿
威尔·史密斯

---

请注意，第一部分是自动生成的，因此记录的数量会有所不同，第二部分中的选项数量应能满足这一要求。谢谢。

这意味着让js编写新代码。最好的解决方案是让服务器端代码（php？）也写出下拉代码。

使用以下方法：

​$(".StaffName")​​​​​​​​.each(function () {
   var name = $(this).text();
   var value = "/listing-agent-staff/" + name.toLowerCase().replace(" ", "-");
   $("<option>").text(name).attr("value", value).appendTo("#Listing_Agent_Staff");
}​);​

​$（“.StaffName”）​​​​​​​​.每个（函数）{
var name=$（this.text（）；
var value=“/listing agent staff/”+name.toLowerCase（）.replace（“，“-”）；
$（“”）.text（name）.attr（“value”，value）.appendTo（“#Listing#u Agent_Staff”）；
}​);​

---

这里有一个

您所要做的就是迭代所有

StaffName

元素，并将适当的HTML附加到select

$.each('.StaffName',function(index,elem){
  var oldValue = $(elem).text().toLowerCase();
  var optionValue = '/listing-agent-staff/' + oldValue.replace(' ','-');
  $("#Listing_Agent_Staff").append('<option value="'+ optionValue +'">'+ $(elem).text() +'</option>';
});

$.each（'.StaffName'，函数（索引，元素）{
var oldValue=$（elem.text（）.toLowerCase（）；
var optionValue='/listing agent staff/'+oldValue.replace（'''-'）；
$（“#列出#代理#人员”）.append（“”+$（elem.text（）+“”；
});

我们在这里所做的是迭代所有

.StaffName

元素，并为每个元素提取其文本值。该值为然后，所有空格都带有破折号。这是为了创建URL。然后我们使用该函数向

#Listing_Agent_Staff

元素添加额外的HTML内容。

var options=>';
var options = '';

$('.StaffName').each(function() {
    var val = $.text(this),
        url = val.toLowerCase().replace(/ /g, '-');
    options += '<option value="/listing-agent-staff/' + url + '">' + val + '</option>';
});

$('#Listing_Agent_Staff').append(options);

$（'.StaffName'）。每个（函数（）{
var val=$.text（此），
url=val.toLowerCase（）.replace（//g，'-'）；
选项+=''+val+''；
});
$（“#列出(代理)人员”）。附加（选项）；

---

这里有一个问题：

同意前面的答案，即在服务器端执行此操作非常理想。如果这样做不起作用，则应注意以下几点：

$(function() {
  $('.StaffName').each(function(e) {
    var div = $(this);
    var href = '/listing-agent-staff/' + div.text().toLowerCase().replace(' ', '-');
    $('#Listing_Agent_Staff').append('<option value="' + href +'">' + div.text() + '</option>');
  });
});​

$（函数（）{
$（'.StaffName'）。每个（函数（e）{
var div=$（本）；
var href='/listing agent staff/'+div.text（）.toLowerCase（）.replace（'''-'）；
$（“#列出_代理_员工”）.append（“”+div.text（）+“”）；
});
});​

---

谢谢……嗯……由于某种原因，我的服务器端编码是不可触及的，这就是为什么我必须在jquery中这样做。