我有一个相当简单的布局:
<div class="faq-wrapper">
<div class="question">
Question
</div>
<div class="answer">
Answer
</div>
</div>
并且根据需要重复这个问题。我想在点击问题时创建一个切换来显示或隐藏答案,这就是我想出来的。
$('.question').click(function() {
if($(this).siblings(".answer").is(":visible")) {
$(this).siblings(".answer").slideUp("fast");
}else {
$(this).siblings(".answer").slideDown("fast");
}
});
这可以关闭打开的答案(默认情况下第一个是打开的)但是当你点击打开一个隐藏的答案时它会滑开然后立即再次滑动关闭。
我也尝试过使用.slideToggle
方法,但这会使开放的方式反弹,然后再打开。
我为我的代码创建的jsfiddle似乎按照我想要的方式工作,因此我不确定如何解决正在发生的事情。 jsfiddle.net/Lj2a49a4/6