滑动切换仅打开1个分区

Question

我是JQuery的新手。我在任何地方都没有找到我的答案，我已经寻找了相当长的一段时间。我想让“面板”在任何触发器被点击时打开，然后显示相应的文本。如果单击另一个触发器，面板将保持打开状态，第一个文本向上滑动(变为隐藏)，并显示下一个文本块。

HTML

<a>trigger text 1</a>
<a>trigger text 2</a>
<a>trigger text 3</a>

<div id="panel" style="display: none;">
    <div id="info-1" style="display: none;"> text </div>

    <div id="info-2" style="display: none;"> text 2 </div>

    <div id="info-2" style="display: none;"> text 3 </div>
</div>

Jquery:我甚至不会为我正在尝试的代码而烦恼……

Answer 1

您可以尝试：

$('a').click(
    function(){
        var which = $(this).index();
        $('#panel').show();
        $('#panel > div:visible').slideUp();
        $('#panel > div').eq(which).slideDown();
    });​

JS Fiddle demo。