Question

因为我在JSFIDDLE找到了简单的手风琴我想从列表菜单中添加控件，例如当我单击无序列表上的panel2时，单击dt上的Panel2（也展开），任何建议。感谢

<ul class="list" style="list-style-type: none;">
<li><a href="#">Panel 1</a></li>
<li><a href="#">Panel 2</a></li>
<li><a href="#">Panel 3</a></li>
</ul>
<dl class="accordion">
<dt><a href="">Panel 1</a></dt>
<dd>Pellentesque fermentum dolor. Aliquam quam lectus, facilisis auctor, ultrices ut, elementum vulputate, nunc.</dd>
<dt><a href="">Panel 2</a></dt>
<dd>Donec nec justo eget felis facilisis fermentum. Aliquam porttitor mauris sit amet orci. Aenean dignissim pellentesque felis.</dd>
<dt><a href="">Panel 3</a></dt>
<dd>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus hendrerit. </dd>
</dl>

(function($) {

  var allPanels = $('.accordion > dd').hide();

  $('.accordion > dt > a').click(function() {
    allPanels.slideUp();
    $(this).parent().next().slideDown();
    return false;
  });
     $('.accordion dt a').first().click();

})(jQuery);

Answer 1

从您的标记中，我假设ul中项目的顺序和手风琴中项目的顺序是相同的，如果是这样，那么在ul li点击中您手动触发点击事件同一个索引中的手风琴标题

(function ($) {

    var allPanels = $('.accordion > dd').hide();

    var $as = $('.accordion > dt > a').click(function () {
        allPanels.slideUp();
        $(this).parent().next().slideDown();
        return false;
    });
    $('.accordion dt a').first().click();

    $('.list li').click(function(e){
        e.preventDefault();
        $as.eq($(this).index()).click();
    })

})(jQuery);

演示：Fiddle

定义列表手风琴与无序列表控件

1 个答案: