我正在尝试这样做,当您点击导航栏上的不同标签时,如果您在标签1上,则按钮不会显示,但会在其他所有时间显示。我正在使用响应式标签(https://github.com/jellekralt/Responsive-Tabs)。
<nav id="header" class="navbar navbar-fixed-top">
<div id="header-container" class="container navbar-container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a id="brand" class="navbar-brand" href="#">Project name</a>
</div>
<div id="navbar" class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div><!-- /.nav-collapse -->
</div><!-- /.container -->
</nav><!-- /.navbar -->
以上代码仅在您第二次点击时有效。我意识到hasClass('active')仅在第二次单击选项卡1时才为真。它检查选项卡1是否在添加类之前使类处于活动状态。如何告诉它等到添加活动类以切换属性之后?响应标签正在添加“活动”类。
答案 0 :(得分:0)
我通过将其包装在超时的检查功能中来修复它!
$('.nav').click(function() {
var check = function() {
if($('#tab-1').hasClass('active'))
{
$('#register-now-button').attr('style', 'display:none');
} else {
$('#register-now-button').attr('style', 'display:flex');
}
}
setTimeout(check, 200);
});