0 
if($('#tab-1').is(':visible'))
    $('#extras').show();
else
    $('#extras').hide();

            <div class='col-lg-12 pull-left'>
                <div class='tab-content'>
                    <ul class="nav nav-pills">
                        <li class="active"><a href="#tab-1" data-toggle='pill'>Lobby</a></li>
                        <li><a href="#tab-2" data-toggle='pill'>Television Talk</a></li>
                    </ul>

                    <br />

                    <div id='tab-1' class='tab-pane active'>
                        <div class='col-lg-12'>
                            <div class="panel panel-primary">
                                <div class='panel-heading'><button class='btn btn-default'>Lobby</button> - <button class='btn btn-default'>Follow Chat</button> - <button class='btn btn-default'><span class='glyphicon glyphicon-user'></span>&nbsp; 236</button> - <button class='btn btn-default'><span class='glyphicon glyphicon-ok'></span> &nbsp; Private</button></div>
                                <div class='panel-body'>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div id='tab-2' class='tab-pane'>
                    </div>

                </div>
            </div>

タブ付きの div があり、id tab-1 が表示されない場合、div エクストラを表示したくありません。

メイン タブ (tab-1) が表示されている場合、またはコンテンツが表示されている場合は、extras div を表示する必要があります。

他のタブ コンテンツが表示されている場合は、エクストラを非表示にします。

上記のコードは機能しませんか? なぜそうしないのですか？

ありがとう。

ああ、私はブートストラップの JavaScript (および css) を使用しています。

4

1 に答える 1

1 
jQuery(function( $ ){ // DOM ready (shorthand)

     $('#extras').toggle( $('#tab-1').is(':visible') );

});

document.readyDocument Object Model が読み取られ、操作できる状態になっていることを確認するには、ハンドラー関数を使用する必要があります。あなたの行動と機能の中に入れてください

DOCSから: http://api.jquery.com/ready/

于 2013-11-05T06:09:57.427 に答える