Question

我正在尝试设置一个手风琴式的标签列表，我可以同时打开多个标签。基本上我希望它像这里一样工作：http://jqueryui.com/demos/accordion/在底部的文档下，当你查看选项选项卡时，它会列出禁用，活动等，你可以打开一个或所有标签。

我看不出你如何设置一个手风琴来做这个，所以我做了一个基本的版本，其中有一个切换工作，但我必须手动输入每个标签的ID来打开/关闭。我确信有一种更有效的方法可以做到这一点，所以它可以扩展到任意数量的项目，有人可以告诉我那是什么......

<style>
.newClass { display: none }
</style>
<script>
$(function() {
    $( "#button-1" ).click(function() {
        $( "#effect-1" ).toggleClass( "newClass", 1000 );
        return false;
    });
    $( "#button-2" ).click(function() {
        $( "#effect-2" ).toggleClass( "newClass", 1000 );
        return false;
    });
});
</script>

<a href="#" id="button-1" class="ui-state-default ui-corner-all">Run Effect 1</a>
<div id="effect-1" class=" ui-corner-all">
        Toggle1
</div>

<a href="#" id="button-2" class="ui-state-default ui-corner-all">Run Effect 2</a>
<div id="effect-2" class=" ui-corner-all">
        Toggle 2 
</div>

如果任何人可以在点击按钮时显示如何动画上下滑动

，则可获得奖励积分

Answer 1

您只需要为页面上的所有切换设置一个通用类。

我使用.next（）切换后面的内容。您可以将其更改为班级或其他任何内容。

以下是演示：http://jsfiddle.net/gZBDK/

以下是关于next（）的更多信息：http://api.jquery.com/next/

Jquery UI - 单独显示/关闭手风琴选项卡

1 个答案: