我想知道如何使用jquery正确编写if语句。我有一堆div,每个都有一个锚点,当点击时使用toggleClass扩展div的宽度。这工作正常,但我想编写一个if语句,检查其他div是否应用了相同的类,如果是这样的合同div,然后扩展下一个div(希望有意义),到目前为止我的代码:
HTML:
<div class="content-block">
<h2>Title</h2>
<p>Content...</p>
<a class="expand" href="#">Expand View</a>
</div>
<div class="content-block">
<h2>Title</h2>
<p>Content...</p>
<a class="expand" href="#">Expand View</a>
</div>
<div class="content-block">
<h2>Title</h2>
<p>Content...</p>
<a class="expand" href="#">Expand View</a>
</div>
<div class="content-block">
<h2>Title</h2>
<p>Content...</p>
<a class="expand" href="#">Expand View</a>
</div>
JQUERY:
$(document).ready(function(){
$('a.expand').click(function(){
$(this).parent('.content-block').toggleClass('wide');
});
});
答案 0 :(得分:3)
你可以这样做,在这种情况下不需要if:
$(document).ready(function(){
$('a.expand').click(function(){
$(this).parent('.content-block').toggleClass('wide')
.siblings('.wide').removeClass('wide');
});
});
这会切换父类的宽类,然后从所有兄弟姐妹中删除该类。
答案 1 :(得分:1)
不需要if语句,只需对应用了removeClass()
类的任何内容运行wide
:
$(document).ready(function(){
$('a.expand').click(function(){
$('.content-block.wide').removeClass('wide');
$(this).parent('.content-block').addClass('wide');
});
});
出于性能考虑,只需使用addClass()
和removeClass()
代替toggleClass()
答案 2 :(得分:0)
你想写这样的东西:
var otherExpanded = $('.content-block.wide');
if (otherExpanded.length)
//Do things