手风琴简单多重jQuery
手风琴简单多重jQuery
提问于 2015-02-24 16:12:07
我有下面的手风琴一见钟情，但当你关闭或点击标题(h3)都关闭，而不是永久。
这是一种独立于其他手风琴工作的手风琴分离的方法。
HTML:
<div class="accordion">
<h3>Lorem 1</h3>
<div>Text-1</div>
<h3>Lorem 2</h3>
<div>Text-2</div>
<h3>Lorem 3</h3>
<div>Text-3</div>
</div>
<div class="accordion">
<h3>Lorem 6</h3>
<div>Text-6</div>
<h3>Lorem 7</h3>
<div>Text-7</div>
<h3>Lorem 8</h3>
<div>Text-8</div>
</div>
<div class="accordion">
<h3>Lorem 12</h3>
<div>Text-12</div>
<h3>Lorem 13</h3>
<div>Text-13</div>
<h3>Lorem 14</h3>
<div>Text-14</div>
</div>JQUERY:
$(".accordion").each(function () {
$(this).find("h3:first").addClass('active').next().slideDown('slow');
$(this).find("h3").click(function () {
if ($(this).next().is(':hidden')) {
$('.accordion h3').removeClass('active').next().slideUp('slow');
$(this).toggleClass('active').next().slideDown('slow');
}
});
});示例： http://jsfiddle.net/3y1b58hh/
回答 1
Stack Overflow用户
回答已采纳
发布于 2015-02-24 16:21:37
您正在调用$(.accordion h3)，它没有连接到$(this)，将触发所有.accordion。使用：
$(".accordion").each(function () {
$(this).find("h3:first").addClass('active').next().slideDown('slow');
$(this).find("h3").click(function () {
if ($(this).next().is(':hidden')) {
$(this).parent().find("h3").removeClass('active').next().slideUp('slow');
$(this).toggleClass('active').next().slideDown('slow');
}
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/28700747
复制相关文章
相似问题
腾讯云开发者
