4

必要な場合にのみ非表示のタブを表示しようとしています。私の現在のコードは次のようになります。

<ul id="myTab" class="nav nav-tabs">
    <li class="active"><a href="#home" data-toggle="tab">Home</a></li>
    <li><a href="#data" data-toggle="tab" style="display:none;">New Tab</a></li>
</ul>

jquery:

$('#data').load('functions/test_function.php', { method: "example"}, function() {
    $('#data').tab('show'); 
   // $('#data').show();    
})

私が間違っていることは何か分かりますか？コードが完了すると、タブは表示されません。

4

1 に答える 1

8

その提供されたコードを使用して、タブコンテンツを表示しようとしていますが、それでも機能しません。

ドキュメントに記載されているように

各タブは個別にアクティブ化する必要があります

data-toggle="tab"また、コンテンツではなく、要素でアクティブ化する必要があります。

$('#data').load('functions/test_function.php', { method: "example"}, function() {

    var $tab = $('[data-toggle="tab"][href="#data"]');
    // OR var $tab = $('#tabID');

    $tab.click(function(e) {      // Binding for later use (for user interaction)
        e.preventDefault();
        $tab.tab('show');
    });
    $tab.show();                  // Display the tab
    $tab.tab('show');             // Display the content
})

明示的なセレクターを保持するか、非表示のタブにを[data-toggle="tab"][href="#data"]設定するかを選択できます。id="tabID"

于 2012-07-31T16:16:17.233 に答える