保持所有手风琴选项可见，但打开/关闭或折叠一次

Question

我有一个定制的手风琴，默认情况下，它拥有"Visible/Open"状态下的所有选项。

当我第一次单击时，它会关闭特定的元素。但是当我再次单击它时，它打开特定的元素，但关闭所有的rest。

它应该折叠并打开一个元素(时间)。

这是我的手风琴代码：

HTML:

<div id='accordionmenu' class="clear">
<ul class="grid-18">
    <li class="inputRow active"> <a href='javascript:;'><h2 class="first">Heading #1</h2></a>
        <ul>
            <li>
                <div class="grid-8">Content for heading 1</div>
            </li>
        </ul>
    </li>
    <li class="inputRow active"> <a href='javascript:;'><h2 class="first">Heading #2</h2></a>
        <ul>
            <li>
                <div class="grid-8">Content for heading 2</div>
            </li>
        </ul>
    </li>
    <li class="inputRow active"> <a href='javascript:;'><h2 class="first">Heading #3</h2></a>
        <ul>
            <li>
                <div class="grid-8">Content for heading 3</div>
            </li>
        </ul>
    </li>

JS

 $('#accordionmenu > ul > li:has(ul)').addClass("has-sub");
 $('#accordionmenu > ul > li > a').click(function () {
     var checkElement = $(this).next();
     $(this).removeClass('active');
     $(this).closest('li').addClass('active');

     if ((checkElement.is('ul')) && (checkElement.is(':visible'))) {
         $(this).closest('li').removeClass('active');
         checkElement.slideUp('normal');
     }

     if ((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
         $('#accordionmenu ul ul:visible').slideUp('normal');
         checkElement.slideDown('normal');
     }

     if (checkElement.is('ul')) {
         return false;
     } else {
         return true;
     }
 });

这里是相同的Fiddle： http://jsfiddle.net/XLw2Z/

如果你需要其他信息，请告诉我。

请建议一下。

Answer 1

这是负责其他手风琴切换：

 if ((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
     $('#accordionmenu ul ul:visible').slideUp('normal');
     checkElement.slideDown('normal');
 }

通过注释行$('#accordionmenu ul ul:visible').slideUp('normal');。一切都按你的意愿运作。

Answer 2

试试这个http://jsfiddle.net/5vG9Z/

 $('#accordionmenu > ul > li:has(ul)').addClass("has-sub");
 $('#accordionmenu > ul > li > a').click(function () {

     $(this).next().toggle('slow')

     return false;
 });