Question

用于Tabcollapse的插件：https://github.com/flatlogic/bootstrap-tabcollapse。
预期结果：两个标签都应显示标签折叠。
当前结果：只有选项卡“ A”显示选项卡折叠内容，而“ B”显示空白。
以移动分辨率查看它。
下面是示例代码。

 $(document).ready(function(){
        $('.inner-tab').tabCollapse();
    })

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap-tabcollapse@0.2.6/bootstrap-tabcollapse.js"></script>
<div class="container" style="margin-top: 50px;">
    <ul class="nav nav-tabs">
        <li class="active"><a href="#a" data-toggle="tab">A</a></li>
        <li><a href="#b" data-toggle="tab">B</a></li>
    </ul>
    <div class="tab-content" >
        <div class="tab-pane fade in active" id="a">
            <ul class="nav nav-tabs inner-tab" style="margin-bottom: 15px;">
                <li><a href="#home" data-toggle="tab">Home</a></li>
                <li class="active"><a href="#profile" data-toggle="tab">Profile</a></li>
            </ul>
            <div class="tab-content" >
                <div class="tab-pane fade" id="home">
                    <p>Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica. Reprehenderit butcher retro keffiyeh dreamcatcher synth. Cosby sweater eu banh mi, qui irure terry richardson ex squid. Aliquip placeat salvia cillum iphone. Seitan aliquip quis cardigan american apparel, butcher voluptate nisi qui.</p>
                </div>
                <div class="tab-pane fade in active" id="profile">
                    <p>Light Blue - is a next generation admin template based on the latest Metro design. There are few reasons we want to tell you, why we have created it:
                        We didn't like the darkness of most of admin templates, so we created this light one. We didn't like the high contrast of most of admin templates, so we created this unobtrusive one.
                        We searched for a solution of how to make widgets look like real widgets, so we decided that deep background - is what makes widgets look real.</p>
                    <button class="btn btn-lg btn-primary">Button with click event attached</button>
                </div>
            </div>
        </div>
        <div class="tab-pane fade" id="b">
            <ul class="nav nav-tabs inner-tab" style="margin-bottom: 15px;">
                <li><a href="#home1" data-toggle="tab">Home</a></li>
                <li class="active"><a href="#profile1" data-toggle="tab">Profile</a></li>
            </ul>
            <div class="tab-content" >
                <div class="tab-pane fade" id="home1">
                    <p>Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica. Reprehenderit butcher retro keffiyeh dreamcatcher synth. Cosby sweater eu banh mi, qui irure terry richardson ex squid. Aliquip placeat salvia cillum iphone. Seitan aliquip quis cardigan american apparel, butcher voluptate nisi qui.</p>
                </div>
                <div class="tab-pane fade in active" id="profile1">
                    <p>Light Blue - is a next generation admin template based on the latest Metro design. There are few reasons we want to tell you, why we have created it:
                        We didn't like the darkness of most of admin templates, so we created this light one. We didn't like the high contrast of most of admin templates, so we created this unobtrusive one.
                        We searched for a solution of how to make widgets look like real widgets, so we decided that deep background - is what makes widgets look real.</p>
                    <button class="btn btn-lg btn-primary">Button with click event attached</button>
                </div>
            </div>
        </div>
    </div>
    
</div>

Answer 1

我无法发表评论，所以让它在这里哈哈。

它在我这边显示，但取决于它的宽度。

Bootstrap选项卡折叠在嵌套选项卡中不起作用

1 个答案: