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) 可见或显示内容,我希望显示附加 div。

如果显示任何其他选项卡内容,我希望隐藏额外内容。

上面的代码不应该工作吗?为什么不呢?

谢谢。

哦,我正在使用引导程序的 JavaScript(和 css)。

4

1 回答 1

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

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

});

您需要使用document.ready处理函数,以确保您的文档对象模型已被读取并准备好进行操作。放入您的操作和功能

来自文档: http : //api.jquery.com/ready/

于 2013-11-05T06:09:57.427 回答