javascript - 我想关闭子元素的打开菜单 li onclick

Question

我的 jQuery 代码可以工作，但我只想在单击它时关闭子 ul(子 ul)；现在，当我也单击父 li 时它正在关闭。我该如何解决此问题？

http://jsfiddle.net/c4k5w/2/

$(document).ready(function(){   

$("ul>li").click(function(){
    var lk=$(this).text();
    var w=$("ul li:contains('"+lk+"')").width();
    $("ul li").removeClass("h");
    $("ul li:contains('"+lk+"')").addClass("h");
    if(w>200){var a=1;$("ul li").removeClass("h");}else{var a=0;}       
    if(a==1){
        $("ul li:contains('"+lk+"') ul").hide(function(){
        $("ul li:contains('"+lk+"')").animate({width:"200px"},"fast");      
        });         
    }else{  
            $("ul li ul").hide();
            $("ul>li").animate({width:"200px"},"fast");
            $("ul li:contains('"+lk+"')").animate({width:"1200px"},"fast",function(){
            $("ul li:contains('"+lk+"')>ul").slideDown();
        });
    }
});

});

Answer 1

您必须为 ul 子级的 click 事件返回 false。

那么这样做:

$(document).ready(function(){       
    $("ul>li").click(function(){
        var lk=$(this).text();
        var w=$("ul li:contains('"+lk+"')").width();
        $("ul li").removeClass("h");
        $("ul li:contains('"+lk+"')").addClass("h");
        if(w>200){var a=1;$("ul li").removeClass("h");}else{var a=0;}       
        if(a==1){
            $("ul li:contains('"+lk+"') ul").hide(function(){
            $("ul li:contains('"+lk+"')").animate({width:"200px"},"fast");      
            });         
        }else{  
                $("ul li ul").hide();
                $("ul>li").animate({width:"200px"},"fast");
                $("ul li:contains('"+lk+"')").animate({width:"1200px"},"fast",function(){
                $("ul li:contains('"+lk+"')>ul").slideDown();
            });
        }
    }).children().click(function(e) {
      return false;
    });

});

DEMO