为什么即使在选择其他选项卡后，最后一个选项卡窗格仍处于活动状

Question

我在包含子视图的大视图上使用bootstrap。我在大视图上有很多标签，但只有一组它们一直出现故障。我检查了其他工作标签丸部分的语法，但最后一个标签部分始终存在。

<div class="row" style="height:350px">
                    <div class="col-lg-3">
                        <h3>Users</h3>
                        <ul class="nav nav-pills nav-stacked">

                            <li id="Cre" class ="active"><a data-toggle="pill" href="#CreUser" onchange="HideIt(1)"> Create User</a></li>
                            <li id="Mod"><a data-toggle="pill" href="#ModUser" onchange="HideIt(2)"> Modify User</a></li>
                            <li id="Del"><a data-toggle="pill" href="#DelUser" onchange="HideIt(3)"> Delete User</a></li>
                        </ul>


                    </div>
                    <div class="container col-lg-8 col-lg-offset-1" style="height:95%;border-radius:70px;border-color:darkblue; border:1px solid">
                        <div class="tab-content col-lg-offset-1">
                            <div id="CreUser" class="tab-pane active">
                                @Html.Action("CreateUser", "Home")
                            </div>
                            <div id="ModUser" class="tab-pane">
                                @Html.Action("ModifyUser", "Home")
                            </div>
                          //  NO MATTER WHAT THIS TAB ALWAYS APPEARS IN THE PANE OR IS PUSHED DOWN OUT OF THE WINDOW PANE BY THE OTHER TAB SECTIONS
                            <div id="DelUser" class="tab-pane">
                                @Html.Action("DeleteUser", "Home")
                            </div>


                        </div>
                    </div>
                </div>

Example Screenshot of Tab Malfuction

非常感谢任何帮助

Answer 1

按顺序链接Bootstrap：

• bootstrap.css
• jquery.min
• bootstrap.js

Check out this: jsfiddle

Answer 2

我错过了修改用户操作视图中的额外div元素。这导致我的标签窗格提前退出，导致下一个标签窗格始终处于活动状态。