3

TwitterBootstrapv2.1.1とそのタブ可能な機能を使用しています。

問題：いずれかのタブをクリックしても、タブボタン自体tab-paneの状態は変化しますが、は変化しません。.tabつまり、タブボタンをクリックすると押し下げられたように見えますが、タブによって変更されるはずのコンテンツは表示されません。Aconsole.log()は、クリックイベントが発生していることを示しています。何か案は？

HTML

<!-- Tab Bar -->
<div class="tab-bar">
    <div class="tab active" id="photos" data-toggle="tab" data-target="#photos">
        <p>Photos</p>
    </div>
    <div class="tab" id="details" data-toggle="tab" data-target="#details"
        ><p>Details</p>
    </div>
</div>

<!-- Tab Panes -->
<div class="tab-content">
    <div id="photos" class="tab-pane">Photos</div>
    <div id="details" class="tab-pane">Details</div>
</div>

JS

$('.tab-bar').tab();
$('.tab-bar .tab').click(function(e) {
    e.preventDefault();
    $(this).tab('show');
    console.log('show');
})

JSに含まれるもの

<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/js/bootstrap.min.js"></script>
<script type="text/javascript" src="http://twitter.github.com/bootstrap/assets/js/bootstrap-tab.js"></script>
4

1 に答える 1

3

いくつかの問題と懸念：

  1. bootstrap-tab.jsのsrcは、TwitterGithubページに直接リンクしています。これがTwitterBootstrapのCDNになることを意図しているとは思わない。このファイルは「自分のドッグフーディングを食べる」と思います。つまり、TwitterBootstrapGithubページはドキュメントとダウンロードにTwitterBootstrapを使用しています。

    それ自体は意図されていないため、ディレクトリ構造またはバージョンをいつでも簡単に変更できます。

  2. bootstrap.min.jsとbootstrap-tab.jsの両方を使用しています。bootstrap.min.jsにはbootstrap-tab.jsが含まれており、両方を使用すると問題が発生すると思います。次の投稿を参照してください：https ：//groups.google.com/forum/？fromgroups =＃！topic / twitter-bootstrap / XH_ttp_9yXg

  3. 私も使ってtwitter bootstrap 2.1.1います。、、、tab-barで見つかりませんでした。2.1.1ファイルを参照し、古いバージョンのTwitter Bootstrapに対してコーディングしている可能性はありますか？bootstrap.min.jsbootstrap-tab.jsbootstrap.css

于 2012-10-04T01:16:02.863 に答える