Question

我有一个多个选择框，其中包含相应国家/地区的城市，用户可以选择多个城市。在表单填写过程中，用户必须首先选择国家/地区，并且需要相应地在多个选择框中更改城市。在我的国家/地区下方选择框和城市多个SB。

<select name="country" id="country" onchange="ajax_change(this.value)">
    <option value="">--Select Country--</option>
    <? echo $countryList;?>
</select>

这是多个选择框

<select multiple="multiple" name="cities[]" id="cities[]" style="height:150px; width:300px;">
    <option value="">-- Select City --</option> 
</select>

这是成功返回城市列表的ajax代码。

<script type="text/javascript">
    function ajax_change(val)
    {

        jQuery.post(
            '<?=WEB_ROOT?>index.php?rt=admin/airport/ajax',
            {
                val:val,
                type:'get_cities'
            },
            function(data){
                $('#cities[]').val(data);
            }
        );
    }
</script>

但$('#cities[]').val(data)无效。你能不能请任何人帮助我。

Answer 1

您希望使用$.each函数循环返回数据（我假设它是JSON），然后将新创建的项追加到列表中。

尝试一下：

<强> HTML

<select id='select' />

<强>的Javascript

var data = {
    'name1':'value1',
    'name2':'value2'
};

$.each(data, function(key, value) {
    $('#select').append($("<option/>").text(key).val(value));
});

上面的jsfiddle：jsfiddle

您还想从ID中删除方括号。

Answer 2

只需使用一个类并从id标签中删除[]

<select multiple="multiple" name="cities[]" class="cities" style="height:150px; width:300px;">
    <option value="">-- Select City --</option>
</select>

和

<script type="text/javascript">
    function ajax_change(val)
    {
       //alert(val);

       jQuery.post('<?=WEB_ROOT?>index.php?rt=admin/airport/ajax',
           {val:val,type:'get_cities'},
           function(data){
               $('.cities').val(data);
           }
       );
    }
</script>

使用Jquery从多个选择框中添加，删除值

2 个答案: