0

我正在尝试构建一个简单的 jQuery 向下滑动导航，但在打开和关闭导航时遇到了一些问题。

我有如下导航。

<ul id="nav">
<li>home</li>
<li class="parent">Clothing
    <ul>
        <li>child</li>
        <li>child</li>
        <li>child</li>
    </ul>
</li>
<li class="parent">shoes
    <ul>
        <li>child</li>
        <li>child</li>
        <li>child
                       <ul>
                          <li>child child</li>
                       </ul>
                    </li>
    </ul>
</li>

使用以下 jQuery

var $j  =   jQuery.noConflict();

$j(document).ready(function() {


$j('#nav').children('.parent').click(function(e){
    e.preventDefault();
    $this = $j(this);
    $j('#nav').children('.parent').children('ul').stop().slideUp('slow', function(){
        $this.children('ul').stop().slideToggle('slow');        
    });
});

});

现在，当我单击子导航滑出时，再次单击什么也不做，我需要它向上滑动。如果我单击另一个，我需要做的是让扩展的导航（如果有的话）向上滑动，然后新的导航向下滑动，但它只是不想对我正常工作！它有问题，两者都同时显示，有时不显示。

4

1 回答 1

2

看到这个...

var $j  =   jQuery.noConflict();

$j(document).ready(function() {
    $j('#nav > .parent').on('click', function(e){
        e.preventDefault();
        $j('#nav > .parent').children().stop().slideUp('slow');
        $j(this).children().stop().slideToggle('slow');
    });
});

请参阅此jSfiddle 示例

于 2013-02-22T15:44:17.520 回答