jquery - 视觉故障 在带有 Bootstrap 选项卡的 Chosen 中使用动态数据

标签 jquery css twitter-bootstrap jquery-chosen

使用 Bootstrap 版本 2.1.1 使用最后选择的

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

J查询代码

$('.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"); 被调用时,它看起来是这样的:

enter image description here

问题是:有什么解决办法吗?

最佳答案

简单添加style="overflow: visible;"<div class="tab-content" style="overflow: visible;">问题解决了:D

关于jquery - 视觉故障 在带有 Bootstrap 选项卡的 Chosen 中使用动态数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12900093/

相关文章:

css - 样式表参数阻止样式表更改

forms - Bootstrap 响应 : How to make columns in row move to only rows with small device?

javascript - 如何防止页面在发布表单后重新加载?

javascript - 使用 jQuery ajax 提交表单

javascript - Promise 和延迟对象

html - jquery 表单提交操作不适用于 document.ready

html - 如何在另一个 DIV 内联中显示固定大小的 DIV?

javascript - 使用 hashchange 来显示/隐藏 div。如何在重新加载页面或使用直接链接时禁用 CSS 转换?

css - 容纳文本的圆形按钮

html - 如何从 Twitter 的 Bootstrap 创建下拉箭头?