0

我通过选择国家/地区来获得下拉列表，使用javascript动态填充状态下拉列表

<div id="ddlState" class='selectBox'>                   
    <span class='selected' id="StatesID">Select a State</span> 
    <span class='selectArrow'>&#9660</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);
        }
    );
});

列表已填充，但选择无法正常工作，它将所有状态项呈现在一个跨度标记中，因此对于选择任何元素，所有列表都被选中

我需要选择单个元素

4

1 回答 1

0

在这一行的代码中看到的是您在跨度内添加了 html，所以只需去掉它：

$('#stateSelectOption span').html(items)

该行必须如下所示（它将代码插入 div 而不是跨度）：

$('#stateSelectOption').html(items)

我在 jsfiddle 上对其进行了测试：http: //jsfiddle.net/uz2vf/

于 2012-12-05T14:55:47.230 回答