35

私はAngularアプリを開発しているので、属性data-targetを使用する代わりにタブペインに一致する属性を使用してブートストラップタブを開発しています（ルートを台無しにする可能性があります）。hrefhref

<ul class="nav nav-tabs" id="myTab">
    <li class="active"><a data-target="home">Home</a></li>
    <li><a data-target="profile">Profile</a></li>
    <li><a data-target="messages">Messages</a></li>
    <li><a data-target="settings">Settings</a></li>
</ul>

<div class="tab-content">
    <div class="tab-pane active" id="home">...</div>
    <div class="tab-pane" id="profile">...</div>
    <div class="tab-pane" id="messages">...</div>
    <div class="tab-pane" id="settings">...</div>
 </div>

<script>
    jQuery(function () {
        jQuery('#myTab a:last').tab('show')
    })
</script>

このフィドルhttp://jsfiddle.net/xFW8t/4/を参照してください。全体を作り直したところ。

タブにブートストラップ スタイルを適用したくありません。機能のみが必要です。スタイルを適用したいのですが、ブートストラップ スタイルの適用を停止するにはどうすればよいですか? 事前に助けてくれてありがとう。

4

4 に答える 4

2

@Sachin で述べたように、data-toggle属性を指定する必要があります。それ以外の場合は、data-targets を正しく入力してください。これらは、 .( link )とともに使用する場合、要素 IDではなくjQuery セレクターを取ります。`data-target

于 2013-10-07T13:32:13.110 に答える
1

使用している場合data-toggle="tab"-jsの初期化を削除できます-

<script>
    jQuery(function () {
        jQuery('#myTab a:last').tab('show')
    })
</script>

Bootstrap はタブを自動的に初期化します。

タブを手動で初期化する場合はdata-toggle="tab"、レイアウトから削除して、すべてのタブを個別に削除できます。

$('#myTab a').click(function (e) {
    e.preventDefault();
    $(this).tab('show');
})
于 2014-12-03T14:25:56.360 に答える