1

我在弄清楚如何使用 JavaScript 在我的网站设计中定位某个项目时遇到问题。

我正在创建一个简单的手风琴：

    $(function($) {
        var allPanels = $('.accordion > dd').hide();
        $('.accordion > dd:nth-child(2)').show();
        $('.accordion > dt > a').on('click', function() {
            allPanels.slideUp('fast');
            $(this).parent().next().slideDown('fast');
        return false;
        });
    });

我更愿意做的是，而不是告诉“.next()”向下滑动，我想将我的一个标签定位为“4 个标签之外”，就像第 n 个孩子一样，但通过点击标签进行测量。这是我的 html 代码，澄清一下：

    <dl class="accordion">
        <dt><a href="">Linked element 1</a></dt>
        <dt><a href="">Linked element 2</a></dt>
        <dt><a href="">Linked element 3</a></dt>
        <dt><a href="">Linked element 4</a></dt>
        <dd>Linked element 1 - dropdown content</dd>
        <dd>Linked element 2 - dropdown content</dd>
        <dd>Linked element 3 - dropdown content</dd>
        <dd>Linked element 4 - dropdown content</dd>
    </dl>
4

1 回答 1

0

尝试这个：

var allPanels = $('.accordion > dd').hide();
$('.accordion > dd:eq(1)').show();
$('.accordion > dt > a').on('click', function () {
    allPanels.slideUp('fast');
    $('.accordion dd').eq($('.accordion dt a').index(this)).slideDown('fast');
    return false;
});

jsFiddle 示例

于 2013-04-30T18:37:15.067 回答