jQuery - 单击时如何停止向上/向下滑动行为答案

【问题标题】：jQuery - how can I stop slide up/down behaviour while clickingjQuery - 单击时如何停止向上/向下滑动行为
【发布时间】：2014-10-27 21:27:23
【问题描述】：

我制作了一个 jQuery Slide up/down Nav.Menu。你可以在这里看到它：

<pre>[http://jsfiddle.net/mobilat/d4L0z7fa/][1]</pre>

如果您单击第一个“MainNav1”，面板会打开/关闭。一切都很好。

但是，如果您单击 MainNav1 并在其之后单击 MainNav2 ans ..3 .. 所有面板都将打开。应先关闭第一个面板/浮出控件，然后再打开另一个面板/浮出控件。

我不知道，我该如何解决这个问题。

感谢您的提示/帮助。 Link

【问题讨论】：

标签： jquery css toggle slide

【解决方案1】：

我添加了代码来查找 ID 以“Slider”和“slidedown”类开头的元素，然后让它们向上滑动。效果很好。

$( 'li.noLinkTrigger' ).each(function( index ) {

   $(this).addClass('item-' + index);

//  console.log( index + ": " + $( this ).text() );

  $( this ).click(function() {
        //$(this).addClass( "foo" );
        //e.preventDefault();
        if ($('#Slider' + index).hasClass("slideup"))
        {
            $('.slidedown').removeClass('slidedown').addClass('slideup');
            $('#Slider' + index).removeClass("slideup").addClass("slidedown");
        }
        else
        {
            $('#Slider' + index).removeClass("slidedown").addClass("slideup");
        }
  });

});

http://jsfiddle.net/d4L0z7fa/11/

【讨论】：

在您的解决方案中，如果您在同一元素中单击两次，则无法折叠导航。
已修复。只需要把它放在 if 语句中

【解决方案2】：

我在切换之前重置滑动类：

    if ($('#Slider' + index).hasClass("slideup")) {

        // .slideup any .slidedown divs
        $('.slidedown').removeClass("slidedown").addClass("slideup");

        $('#Slider' + index).removeClass("slideup").addClass("slidedown");
    } else {
        $('#Slider' + index).removeClass("slidedown").addClass("slideup");
    }

http://jsfiddle.net/d4L0z7fa/10/

【讨论】：