首页   注册   登录
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX  ›  HTML

js html()覆盖请教一个层级关系

  •  
  •   fanne · 168 天前 · 415 次点击
    这是一个创建于 168 天前的主题,其中的信息可能已经有所发展或是发生改变。
    html 代码
    <div class="row">
            <div class="col-sm-6">
                <select class="form-control m-b" name="server_lists" id="server_lists">
                <option>选择服务器</option>
                    {% for server_i in server_lists %}
                    <option value="{{ server_i.id }}">{{ server_i.public_ip }}</option>
                    {% endfor %}
                </select>
            </div>
        <div class="col-sm-6 pull-right">
            <select class="form-control m-b" name="server_lists" id="server_lists">
            <option>选择服务器</option>
                {% for server_i in server_lists %}
                <option value="{{ server_i.id }}">{{ server_i.public_ip }}</option>
                {% endfor %}
            </select>
        </div>
        </div>
    
    <div class="row">
        <div class="col-sm-6">
    
        <button type="button" class="btn btn-default" id='select-all'>全选</button>
        <button type="button" class="btn btn-default" id='deselect-all'>全不选</button>
    
            <select id='pre-selected-options' multiple='multiple' name="game_id">
    
            </select>
        </div>
    </div>
    
    <br>
    
    <div class="row">
        <div class="col-sm-4">
            <button class="btn btn-primary"   type="button" onclick="mtSelect(this)">
                开始迁移
            </button>
    
        </div>
    
    js 代码
    <script type="text/javascript">
    $(document).ready(function () {
        $('#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;
            });
    
        $("#server_lists").change(function () {
            var server_i = $("#server_lists").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").html(content)
                }
                
            })
        });
    
    });
    
    </script>
    
    

    问题如下:

    应该是 js 的一个层级关系覆盖了 alert(content);是有内容的

    $("#pre-selected-options").html(content)内容为空的

    后来测试把

    $('#pre-selected-options').multiSelect();
    

    注释了就正常,但那个多选框功能不全

    那现在这个情况要怎么改的?

    2 回复  |  直到 2018-09-04 09:03:16 +08:00
        1
    Hasel   168 天前
    你可以在$("#pre-selected-options").html(content) 后面再初始化 multiSelect 试试。
        2
    fanne   168 天前
    @Hasel 可行,不过那个多选框多样式没了,等到选完服务器后,初始化 multiSelect 就正常样式,不过功能能用了,多谢
    关于   ·   FAQ   ·   API   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   3963 人在线   最高记录 4385   ·  
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.3 · 15ms · UTC 07:45 · PVG 15:45 · LAX 23:45 · JFK 02:45
    ♥ Do have faith in what you're doing.
    沪ICP备16043287号-1