2

Bootstrapをタブで動作させようとしていますが、何らかの理由で、何を試しても、タブが機能しません。それらは正しく表示されますが、リンクをクリックしてもタブは変更されません。紛らわしいのは、自分のコードをもう使用していないことです。他の質問への回答として提出された「実例」に属すると思われるコードをコピーして貼り付けています。

これが私が使用している最新のコードです。別の質問への回答として提出されたフィドルで完全に機能し、テストしようとしている場所を除いて、ほとんどどこでも正常に機能します。ファイルをストレートHTMLとして開き、Djangoランタイムサーバーで提供し、Apacheサーバーで提供しましたが、何も機能していないようです。

http://jsfiddle.net/ivobos/fuBK6/

<html>
    <head>
        <link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="http://twitter.github.com/bootstrap/assets/js/bootstrap-tab.js"></script>
        <script src="http://code.jquery.com/jquery-1.7.1.js"></script>
        <title>TabTest</title>
    </head>
    <body>
        <div class="tabbable">
           <ul class="nav nav-tabs">
             <li class="active"><a href="#tab1" data-toggle="tab">tab1</a></li>
             <li><a href="#tab2" data-toggle="tab">tab2</a></li>
           </ul>
           <div class="tab-content">
               <div id="tab1" class="tab-pane active">tab1 content</div>
               <div id="tab2" class="tab-pane">tab2 content</div>
           </div>
        </div>
    </body>
</html>
4

1 に答える 1

7

jquery-1.7.1.jsスクリプトをスクリプトの上に移動してみてくださいbootstrap-tabs.js

<head>
    <link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet" type="text/css" />
    <script src="http://code.jquery.com/jquery-1.7.1.js"></script>
    <script type="text/javascript" src="http://twitter.github.com/bootstrap/assets/js/bootstrap-tab.js"></script>
    <title>TabTest</title>
</head>
于 2012-12-28T20:28:13.463 に答える