使用引导选项卡选择的动态数据的视觉故障答案

【问题标题】：Visual Glitch Using dynamic-data in Chosen with bootstrap tabs使用引导选项卡选择的动态数据的视觉故障
【发布时间】：2012-10-15 16:38:55
【问题描述】：

使用引导程序版本 2.1.1 使用最后选择的

我正在尝试在选项卡内容中重新呈现所选内容时出现视觉故障，在选项卡内容 div 和滚动条内创建一个空白区域。

jQuery 代码

$('.chzn-select').chosen();
    <?php if(!empty($data_which_depends_the _chosen)){ ?>
     $.ajax({
        url: '<?php echo(site_url("/url_to_get_the_data/")); ?>',
        dataType: 'json',
        type: 'POST',
        data: {
            l: <?php echo($data_which_depends_the _chosen); ?>,
            <?php echo $this->security->get_csrf_token_name()?>: '<?php echo $this->security->get_csrf_hash()?>'
        },
        success: setChosenOptions
    });
    <?php } ?>

...

var setChosenOptions = function(data)
{
    $("select[name='numChosen[]']").children().remove();
    if(data !== null)
    {
        $.each(data.data, function(i,item){
            <?php if(!$readOnly){ ?>
            $("select[name='numChosen[]']").append('<option value="' + item.ids + '">' + item.number + '</option>');
            <?php }else{ ?>
            $("select[name='numChosen[]']").append('<option disabled="disabled" value="' + item.ids + '">' + item.number + '</option>');
            <?php } ?>
        });
        $.ajax({
            url: '<?php echo(site_url("/url_to_get_other_data/")); ?>',
            dataType: 'json',
            type: 'POST',
            data: {
                l: '<?php echo($data_which_depends_the _chosen); ?>',
                <?php echo $this->security->get_csrf_token_name()?>: '<?php echo $this->security->get_csrf_hash()?>'
            },
            success: function(data){
                if(data !== null)
                {
                    $.each(data.data, function(i,item){
                        if($("select[name='numChosen[]']").find("option[value=" + item.ids + "]").length)
                            $("select[name='numChosen[]']").find("option[value=" + item.ids + "]").attr('selected','selected');
                        else
                            $("select[name='numChosen[]']").append('<option selected="selected" disabled="disabled" value="' + item.ids + '">' + item.number + '</option>');
                    });
                }
                $("select[name='numChosen[]']").trigger("liszt:updated");
            }
        });                 
    }
}

当调用$("select[name='numChosen[]']").trigger("liszt:updated"); 时会出现所有问题，它的外观是这样的：

问题是：有什么想法可以解决吗？

【问题讨论】：

标签： jquery css twitter-bootstrap jquery-chosen

【解决方案1】：

只需将style="overflow: visible;" 添加到<div class="tab-content" style="overflow: visible;"> 即可解决问题：D

【讨论】：