如何在jquery中删除slideUp

时间:2015-12-25 06:11:30

标签: javascript jquery html html5

我想删除这些上滑功能

$( document ).ready(function() {
    $("#tabBar ul.buttons > li > a").on("click", function(e){
        //if submenu is hidden, does not have active class
        if(!$(this).hasClass("active")) {

            // hide any open menus and remove active classes
            $("#tabBar ul.buttons li ul").slideUp(350);
            $("#tabBar ul.buttons li a").removeClass("active");

            // open submenu and add the active class
            $(this).next("ul").slideDown(350);
            $(this).addClass("active");

        //if submenu is visible
        }else if($(this).hasClass("active")) {

            //hide submenu and remove active class
            $(this).removeClass("active");
            $(this).next("ul").slideUp(350);
        }
    });
});

当我通过Jquery

向身体添加另一个div时
$(document).ready(function(){
    $(".Collapse_menu").click(function(){
        $(".bodyStatic").toggleClass("collapse-body");
        //comment: here i want to add my code so that when i call collapse-body the top slide up function should remove
    });
});

我正在制作一个可折叠的菜单,这些图片可以帮助您更好地理解

enter image description here enter image description here

2 个答案:

答案 0 :(得分:1)

这是我的尝试

if($(".bodyStatic").hasClass("collapse-body"))
{
    //DO NOTHING
}
else
{
    $(this).next("ul").slideUp(350);
}

//OR VICE VERSA

答案 1 :(得分:1)

根据我的理解,只要您click .Collapse_menu,就要折叠水平展开的菜单以及关闭垂直打开的子菜单。如果是这种情况,那么您可能需要尝试以下代码:

<强>代码1:

$( document ).ready(function() {
    $("#tabBar ul.buttons > li > a").on("click", function(e){

        if($(".bodyStatic").hasClass("collapse-body"))
        {
            $(".bodyStatic").removeClass("collapse-body")
        }
        //if submenu is hidden, does not have active class
        if(!$(this).hasClass("active")) {

            // hide any open menus and remove active classes
            $("#tabBar ul.buttons li ul").slideUp(350);
            $("#tabBar ul.buttons li a").removeClass("active");

            // open submenu and add the active class
            $(this).next("ul").slideDown(350);
            $(this).addClass("active");

        //if submenu is visible
        }else if($(this).hasClass("active")) {

            //hide submenu and remove active class
            $(this).removeClass("active");
            $(this).next("ul").slideUp(350);
        }
    });
});

代码2:

$(document).ready(function(){
    $(".Collapse_menu").click(function(){
        $(".bodyStatic").toggleClass("collapse-body");

        var activeSubmenu = $("#tabBar ul.buttons > li > a.active"); //grab the active submenu if any
        //hide submenu and remove active class
        $(activeSubmenu).removeClass("active");
        $(activeSubmenu).next("ul").slideUp(350);
    });
});

请让我知道结果。