jQuery Accordion父链接

时间:2011-08-02 21:25:25

标签: javascript jquery

我想在显示子菜单后点击它的链接显示子菜单,如何在下面完成我的代码

我的HTML

        <ul id="menu">
            <li>
                <a href="http://stackoverflow.com/questions/ask">Menu 1 1</a>
                <ul>
                    <li><a href="http://yahoo.com/">Menu 1 Sub</a></li>
                </ul>
            </li>

            <li>
                <a href="http://stackoverflow.com/">Menu 2</a>
                <ul>
                    <li><a href="http://google.com/">Menu 2 Sub 1</a></li>
                    <li><a href="http://wiki.com/">Menu 2 Sub 2</a></li>
                </ul>
            </li>

       </ul>

我的CSS

ul#menu, ul#menu ul {
  list-style-type:none;
  margin: 0;
  padding: 0;
  width:220px;
}

ul#menu a { font:bold 12px Arial, Helvetica, sans-serif;
  display: block;
  text-decoration: none;    
}

ul#menu li {
  margin-top: 1px;
}

ul#menu li a {
  background: #1c3f94;
  color: #fff;    
  padding: 0.5em;
}

ul#menu li a:hover {
  background: #000;
}

ul#menu li ul li a {
  background: #ccc;
  color: #000;
  padding-left: 20px;
}

ul#menu li ul li a:hover {
  background: #aaa;
  border-left: 5px #000 solid;
  padding-left: 15px;
}

我的JS

function initMenu() {
  $('#menu ul').hide();
  $('#menu ul:first').show();
  $('#menu li a').click(
    function() {
      var checkElement = $(this).next();
      if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
        return false;
        }
      if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
        $('#menu ul:visible').slideUp('normal');
        checkElement.slideDown('normal');
        return false;
        }
      }
    );
  }
$(document).ready(function() {initMenu();});

LIVE DEMO

1 个答案:

答案 0 :(得分:1)

第一个条件为真时不要返回false:

function initMenu() {
    $('#menu ul').hide();
    $('#menu ul:first').show();
    $('#menu li a').click(function () {
        var checkElement = $(this).next();
        if ((checkElement.is('ul')) && (checkElement.is(':visible'))) {
            return true;
        }
        if ((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
            $('#menu ul:visible').slideUp('normal');
            checkElement.slideDown('normal');
            return false;
        }
    });
}