Question

最近我遇到了这个（http://bootsnipp.com/snippets/featured/e-mail-interface）代码片段，当我开始尝试它时，我注意到有一些关于来回切换到标签的奇怪行为。

根据我的意思，当用户切换到具有不同散列位置的标签时，切换按预期工作（#inbox - ＆gt; #compose - ＆gt; #trash - ＆gt; #inbox）。但是，如果用户在相同的标签之间重复切换，即#inbox - ＆gt; #compose - ＆gt; #inbox它没有执行切换。

是否有任何特定因素导致此行为？

Answer 1

Bootstrap Tab stuff

支持DOM的结构。

＆＃39;撰写＆＃39;按钮应该是导航栏ul的一部分。

 <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
        <ul class="nav navbar-nav">
        <li style="padding-right:20px;border-right:1px solid #ccc;">
            <p>
            <a type="button" class="btn btn-danger navbar-btn" style="height: 35px; color:#fff;" href="#compose" role="tab" data-toggle="tab"> <span class="glyphicon glyphicon-pencil"></span> Compose</a>
            </p>
        </li>

            <li>
                <a href="#inbox" role="tab" data-toggle="tab">
                    Inbox <span class="label label-success">10</span>
                    .....

相反：

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
        <div class="btn-compose pull-left">
            <a type="button" class="btn btn-danger navbar-btn" href="#compose" role="tab" data-toggle="tab"> <span class="glyphicon glyphicon-pencil"></span> Compose</a>
        </div>
        <ul class="nav navbar-nav">
            <li>
                <a href="#inbox" role="tab" data-toggle="tab">
                    Inbox <span class="label label-success">10</span>

Here's a working fiddle.它还修复了原始点击“撰写”的问题。在小屏幕上打开收件箱。

Bootstrap不会在相同的选项卡之间反复切换

1 个答案: