jquery - 响应式菜单 : go to URL on second click

Question

我的网站上有一个响应式菜单
我想在第一次点击时显示菜单下拉菜单，在第二次点击时菜单选项卡转到 URL

fiddle :http://jsfiddle.net/khizer_najeeb/7rRK7

HTML

<ul id="menu-principal">
  <li><a href="#" class="one">Zero</a></li>
  <li><a href="one.html" class="two">One</a>
    <ul>
      <li><a href="one1.html" class="one1">One 1</a></li>
      <li><a href="one1.html" class="one2">One 2</a>
         <ul><li><a href="one1.html" class="one2">One 2</a></li>
             <li><a href="one1.html" class="one2">One 2</a></li></ul>
      </li>
      <li><a href="one1.html" class="one3">One 3</a></li>
    </ul>
  </li>
  <li><a href="two.html" class="two">Two</a>
    <ul>
      <li><a href="two1" class="two1">Two 1</a></li>
      <li><a href="two2" class="two2">Two 2</a></li>
      <li><a href="two3" class="two3">Two 3</a></li>
    </ul>
  </li>
</ul>

CSS

ul#menu-principal { margin: 0; padding: 0; margin-left: 30px; list-style: none; }
ul#menu-principal li { border-bottom: 1px solid #164a7f; }
ul#menu-principal li li:last-child { width: 85px; border-bottom: none; }       
ul#menu-principal li a {  display: block; height: 28px;  background: #FFF; }
ul#menu-principal ul{padding:0 0 0 30px; width: 150px}
ul#menu-principal li li {  }

JS

$(document).ready(function () {
    $('#menu-principal li').children('ul').hide();
    $('#menu-principal li').click(function () {

        if ($(this).children('ul').is('') == true) {
            return false
        }
    })
});

Answer 1

替换以下代码:

$('#menu-principal li').click(function () {

    if ($(this).children('ul').is('') == true) {
        return false
    }
})

跟随

$('#menu-principal a').click(function (e) {
    if ($(this).parent().children('ul').is(':visible') != true) {
        $(this).parent().children('ul').show();
        e.preventDefault();
        return false;
    }
})