我通过选择国家/地区来获取下拉列表,使用javascript动态填充状态下拉列表
<div id="ddlState" class='selectBox'>
<span class='selected' id="StatesID">Select a State</span>
<span class='selectArrow'>▼</span>
<div class="selectOptions" id="stateSelectOption">
<span class="selectOption" id="ddlStateText" >Select a State</span>
</div>
</div>
点击国家/地区,填写了状态,代码位于
之下$('#CountriesID').click(function () {
var items;
$('#CountriesID').removeClass("input-validation-error");
if (!$("select#CountriesID").val() == "Select a Country") {
document.getElementById("disableasterisk9").style.display = "";
}
else {
document.getElementById("disableasterisk9").style.display = "none";
}
var countryid = $('#CountriesID').text();
$.getJSON(
"@Url.Action("StateList1", "UserRegistration")" + '/' + countryid,
function (data) {
var items = "<span id='ddlStateText' class='selectOption'>Select a State </span>";
$.each(data, function (i, state) {
items += "<span id='ddlStateText' value='" + state.Value + "' class='selectOption'>" + state.Text + "</span>";
});
$('#stateSelectOption span').html(items);
}
);
});
列表已填充但选择不正常它会渲染一个span标记中的所有状态项,以便选择任何元素所有列表都被选中
我需要选择单个元素
答案 0 :(得分:0)
在这一行的代码中看到的是你在跨度中添加你的html,所以只需要拿走:
$('#stateSelectOption span').html(items)
该行必须如下所示(它会将代码插入div而不是span中):
$('#stateSelectOption').html(items)
我在jsfiddle上测试了它: http://jsfiddle.net/uz2vf/