1

Web ページの 3 つのフォームにタブ可能なナビゲーションを作成しようとしています。タブで Javascript を動作させることができません。Twitter ドキュメントには 2 つのスクリプトがあります。

$('#myTab a').click(function (e) {
  e.preventDefault();
  $(this).tab('show');
})

と

$('#myTab a[href="#profile"]').tab('show'); // Select tab by name
$('#myTab a:first').tab('show'); // Select first tab
$('#myTab a:last').tab('show'); // Select last tab
$('#myTab li:eq(2) a').tab('show'); // Select third tab (0-indexed)

これは、ドキュメントに記載されているタブ可能なナビゲーションの html です。

<div class="tabbable"> <!-- Only required for left/right tabs -->
  <ul class="nav nav-tabs">
    <li class="active"><a href="#tab1" data-toggle="tab">Section 1</a></li>
    <li><a href="#tab2" data-toggle="tab">Section 2</a></li>
  </ul>
  <div class="tab-content">
    <div class="tab-pane active" id="tab1">
      <p>I'm in Section 1.</p>
    </div>
    <div class="tab-pane" id="tab2">
      <p>Howdy, I'm in Section 2.</p>
    </div>
  </div>
</div>

2 つのタブのいずれかがクリックされたときに適切なコンテンツを表示するには、Web ページでこれら 2 つのコード ブロックを使用するにはどうすればよいですか? 私はJavascriptの初心者です。物事を成し遂げたいだけです。

4

1 に答える 1

3

各タブに data-toggle='tab' 属性があるため、タブを個別に有効にする必要はありません。ページにbootstrap.jsファイルを追加したことを確認してください。

必要に応じて、次の例をご覧ください: http://jsfiddle.net/voytko/TVUPF/

于 2012-10-02T00:22:02.183 に答える