Question

我是bootstrap的新手。虽然在这个问题上有很多问题，但我仍然无法弄清楚出了什么问题。当我点击第二个或第三个标签时，内容不会改变。

</head>
<body>
    <div class="tabbable tabs-left">
        <ul class="nav nav-tabs">
            <li ><a href="#tab1" data-toggle="tab">Tab1</a></li>
            <li ><a href="#tab2" data-toggle="tab">Tab2</a></li>
            <li ><a href="#tab3" data-toggle="tab">Tab3</a></li>
        </ul>
        <div class="tab-content">
            <div class="tab-pane" id="tab1"><p>Tab1 Content</p></div>
            <div class="tab-pane" id="tab2"><p>Tab2 Content</p></div>
            <div class="tab-pane" id="tab3"><p>Tab3 Content</p></div>
        </div>
    </div>

    <script src="bootstrap.min.js"></script>
    <script src="jquery.js"></script>
    <script>
</script>
</body>

Answer 1

您在 jquery.js之前包含了bootstrap.min.js文件。它应该包含在之后 jquery.js。

只需将其更改为：

<script src="jquery.js"></script> <script src="bootstrap.min.js"></script>

Answer 2

在body之前包含bootstrap.min.js和jquery.js.

类似这样的事情

<head>
  <script src="bootstrap.min.js"></script>
  <script src="jquery.js"></script>
</head>
<body>

body content goes here

</body>

bootstrap tabbable不切换

2 个答案: