自定义jQuery Accordion

Question

我想做以下事情：

1）默认打开第一个框＆amp; 2）单击时关闭该框。现在它关闭＆amp;立即重新开启。

DEMO： http://jsfiddle.net/2hmzcgqm/

    (function($) {

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

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

})(jQuery);

Answer 1

1）在click处理程序后添加此行：

$('.accordion > dt > a').first().trigger('click');

2）在click处理程序的第二行添加此行：

if ($(this).parent().next().is(":visible")) return false;

所以：

$('.accordion > dt > a').click(function() {
    allPanels.slideUp();
    if ($(this).parent().next().is(":visible")) return false;
    $(this).parent().next().slideDown();
    return false;
});
$('.accordion > dt > a').first().trigger('click');

更新FIDDLE

Answer 2

小提琴：http://jsfiddle.net/2hmzcgqm/3/ 保存可见性，然后它将确定是否必须显示或隐藏

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

  $('.accordion > dt > a').click(function() {
    var $dd = $(this).parent().next(),
        isShown = $dd.is(':visible');

    allPanels.slideUp();

    $dd[isShown ? 'slideUp' : 'slideDown']();

    return false;
  });

  $('.accordion > dt > a').get(0).click();