bootstrap js二级联动查询问题

Question

当选择IP:192.168.1.29，可以获取到游戏服：1002，1003，1004

当选择ip：192.168.1.29，可以获取到游戏服：40001，40002

但是，游戏服那里框里面值没有变

还是刚才选择IP:192.168.1.29的内容

js内容

$(document).ready(function () {

    $("#source_ip").change(function () {
        var server_i = $("#source_ip").val();
        $.ajax({
            data: {'obj_id': server_i, csrfmiddlewaretoken: '{{ csrf_token }}'},
            type: 'POST',
            url: '/pro1/gamemigratedata/' + server_i + '/',
            success: function (data) {

                var content = '';
                $.each(data, function (i, item) {
                    content += '<option value='+'"'+item.gameid+'"'+'>'+item.gameid+'</option>'
                });
                alert(content);
                $("#pre-selected-options").empty();
                $("#pre-selected-options").html(content);
                $('#pre-selected-options').multiSelect();
                $('#select-all').click(function(){
                $('#pre-selected-options').multiSelect('select_all');
                    return false;
                });
                $('#deselect-all').click(function(){
                  $('#pre-selected-options').multiSelect('deselect_all');
                  return false;
                });
            }
            
        })
    });

});

html内容

<div class="col-sm-6">
    <select class="form-control m-b" name="server_lists" id="source_ip">
    <option value="">选择服务器</option>
        {% for server_i in server_lists %}
        <option value="{{ server_i.id }}">{{ server_i.public_ip }}</option>
        {% endfor %}
    </select>
</div>

<select id='pre-selected-options' multiple='multiple' name="game_id">
    <option>选择游戏服</option>
</select>                                    

贴一个动图

Answer 1

没用过multiSelect
我觉得修改multiSelect的内容 不能直接empty再html初始化吧
看看multiSelect的文档怎么修改内容 用它自己的方法