Question

I have created a simple accordion menu.My problem is when i click "Folder1" it expands but when i click it back again it should collapse .. i m stuck with that and not able to proceed any help..

JsFiddle - 。

$(document).ready(function() {


    $( #content >li ).each(function(i){

        hideElements($(this));
    });

    $( #content ).click(function(event) {

        $x = $(event.target);

        //check if the element is the root node if so then hide all other li s and reveal the current one
        if($x.parent().is( ul#content )) {

            if($x.is( :visible )) {     //check if its already expanded .. if so then collapse and return
                $x.find( ul >li ).slideUp(300 , function() {
                    **//return;** does not work

                });
            }

            $( #content ul>li ).each(function(i){                   
                    collapseElements($(this));
            });
        }


        if($x.is( li ))
            $x.find( ul:first > li ).slideToggle(300);  



    });


    function collapseElements(el) {
        if(el.is( :visible )) {
            el.slideUp(300);
        }

    }

    function hideElements(elem) {
        elem.find( ul >li ).hide(); 

        //$($e >li).hide(); 
    }
});

Answer 1

Simplest code that works:

$( #content ).click(function(event) {
  var $el = $(event.target);
  $el.find( ul:first > li ).slideToggle(300);    
});

虽然, 无国籍是一件坏事。

友情链接