所以,我已经做了大量的研究,试图找到这个,但似乎无法找到有效的东西。我使用.slidetoggle()在一个页面上有多个div。在子div中显示更多内容。我想要做的就是添加一个“全部展开”按钮,这个按钮只会扩展那些被关闭的按钮,而剩下的只剩下其他按钮。目前,扩展所有的作品,但只有当所有的项目都崩溃了。否则,它基本上只是切换,所以如果用户打开一个项目,然后决定他们只是想查看所有项目,它将打开那些已关闭,但关闭已打开的项目。我知道有一个简单的方法可以解决这个问题,但我对jQuery和javascript都比较陌生。.slideToggle()只有折叠的物品
这是我目前的代码 - 我很抱歉,如果它是sl,的,我是一个初学者!
$(document).ready(function(){
$(".question1").click(function(){
$("#answer1").slideToggle();
});
});
$(document).ready(function(){
$(".question2").click(function(){
$("#answer2").slideToggle();
});
});
$(document).ready(function(){
$(".question3").click(function(){
$("#answer3").slideToggle();
});
});
$(document).ready(function(){
$(".expandall").click(function(){
$(".answer").slideToggle();
});
});
而我的HTML的
<button class="expandall">Expand All</button>
<div class="question">
<button class="question1"><b>This is a Question</b></button>
</div>
<div id="answer1" class="answer" style="display:none;">
This is an answer
</div></div>
<div class="question">
<button class="question2"><b>This is a Question</b></button>
</div>
<div id="answer2" class="answer" style="display:none;">
This is an answer
</div></div>
<div class="question">
<button href="#" class="question3"><b>This is a Question</b></button>
</div>
<div id="answer3" class="answer" style="display:none;">
This is an answer
</div></div>
帮助!
非常感谢!这工作就像一个魅力:)并感谢您对重复$(document).ready函数和重复点击函数的反馈。我知道有一种方法只能控制父母的一个子div,所以你可以使用这个功能,但不太清楚如何去做。 – 2015-01-28 05:22:19
@KiannaChauntis很高兴我能够帮助你:)。如果这回答了你的问题,你可以考虑接受这个答案,这样问题将被标记为关闭/解决。如果你不知道这是如何工作的,为什么,只要检查http://meta.stackexchange.com/questions/5234/how-does-accepting-an-answer-work#answer-5235 – 2015-01-28 22:58:41