Jquery 切换 Accordion

Question

我正在尝试制作一个带切换功能的 Accordion ，现在看起来效果很好。作为 javascript 的新手，我希望得到一些帮助，那就是它的组合方式。

http://jsfiddle.net/z3wW4/

我知道这不太漂亮......

    $(document).ready(function() {
     $('#contact').click(function() {
        $('#content2, #content3').hide(200, 'linear');
          $('#content').toggle(700, 'linear');          
    });
});

$(document).ready(function() {
     $('#services').click(function() {
        $('#content, #content3').hide(200, 'linear');
          $('#content2').toggle(700, 'linear');
    });
});

$(document).ready(function() {
     $('#about').click(function() {
        $('#content, #content2').hide(200, 'linear');
          $('#content3').toggle(700, 'linear');
    });
});

Answer 1

我建议:

 $('#menu > a').click(function() { // specifies which a elements
     var that = $(this), // caching the selectors for performance
         divs = $(this).siblings('div'),
         div = $(this).nextAll('div:first');
     divs.not(div).hide(200, 'linear'); // hides all the sibling divs *except* for the
                                        // immediately following div element
     div.toggle(700, 'linear');         // toggles the immediately-following div
});

​ JS Fiddle demo .

引用文献:

• click() .
• nextAll() .
• not() .
• siblings() .
• toggle() .