保持多个部分打开的jQuery UI折叠功能？
保持多个部分打开的jQuery UI折叠功能？
提问于 2010-08-14 01:52:13
我可能是个笨蛋，但如何在jQuery UI的手风琴中保持多个部分处于打开状态呢？所有的演示一次只有一个打开...我正在寻找一个可折叠的菜单类型的系统。
回答 12
Stack Overflow用户
发布于 2012-04-20 06:45:06
非常简单：
<script type="text/javascript">
(function($) {
$(function() {
$("#accordion > div").accordion({ header: "h3", collapsible: true });
})
})(jQuery);
</script>
<div id="accordion">
<div>
<h3><a href="#">First</a></h3>
<div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div>
</div>
<div>
<h3><a href="#">Second</a></h3>
<div>Phasellus mattis tincidunt nibh.</div>
</div>
<div>
<h3><a href="#">Third</a></h3>
<div>Nam dui erat, auctor a, dignissim quis.</div>
</div>
</div>Stack Overflow用户
发布于 2012-11-10 04:42:09
或者甚至更简单？
<div class="accordion">
<h3><a href="#">First</a></h3>
<div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div>
</div>
<div class="accordion">
<h3><a href="#">Second</a></h3>
<div>Phasellus mattis tincidunt nibh.</div>
</div>
<div class="accordion">
<h3><a href="#">Third</a></h3>
<div>Nam dui erat, auctor a, dignissim quis.</div>
</div>
<script type="text/javascript">
$(".accordion").accordion({ collapsible: true, active: false });
</script>Stack Overflow用户
发布于 2011-01-26 13:47:49
我已经做了一个jQuery插件，具有相同的外观jQuery UI Accordion，并可以保持所有的标签\部分打开
你都能在这找到你的需要
http://anasnakawa.wordpress.com/2011/01/25/jquery-ui-multi-open-accordion/
使用相同的标记
<div id="multiOpenAccordion">
<h3><a href="#">tab 1</a></h3>
<div>Lorem ipsum dolor sit amet</div>
<h3><a href="#">tab 2</a></h3>
<div>Lorem ipsum dolor sit amet</div>
</div>Javascript代码
$(function(){
$('#multiOpenAccordion').multiAccordion();
// you can use a number or an array with active option to specify which tabs to be opened by default:
$('#multiOpenAccordion').multiAccordion({ active: 1 });
// OR
$('#multiOpenAccordion').multiAccordion({ active: [1, 2, 3] });
$('#multiOpenAccordion').multiAccordion({ active: false }); // no opened tabs
});更新:插件已更新为支持默认的活动选项卡选项
更新:这个插件现在被弃用了。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/3479447
复制相关文章
相似问题