如何在jquery中隐藏子元素子元素 [英] How to hide child element child elements in jquery

问题描述

我有一个菜单从mysql表和php填充到一些嵌套的子级别。

这样的菜单

A

B

C



如果点击A第一次显示所有子元素并且我点击A的子元素显示子元素也很好。

但问题是当我打开所有级别项目A

之后点击B它显示B子元素很好。但是再次如果我点击A它显示所有除了子元素元素之外的元素也。我使用jquery这个。我是jquery的新手，请任何人都可以提前帮助我。



我尝试过什么：

i have a menu populating from mysql table and php upto some nested sublevels.
my menu like this
A
B
C

if click on A first time it showing all the child elements and againg i click child elements of A it displaying child elements also fine.
but the problem is when i click on the B after open all the levels items of A
it showing B subelements fine.But again if i click A it showing all the elements except child child elements also.i used jquery for this.i am new to jquery please anybody can help me thanks in advance.

What I have tried:

<ul>
<li class="limain">A
<ul>
<li class="lichild">A1
<ul>
<li class="lichild">a2</li><li class="lichild">a1
<ul>
<li class="lichild"><a href="vuv">aaaaaa</a></li><li class="lichild"><a href="xyz">abbbbbb</a></li></ul>
</li></ul>
</li><li class="lichild">A2</li><li class="lichild">A3</li><li class="lichild">A4</li><li class="lichild"><a href="home">A5</a></li></ul>
<li class="limain">B
<ul>
<li class="lichild">B1</li><li class="lichild"><a href="about">B2</a></li></ul>
</li><li class="limain">C
<ul>
<li class="lichild">C1</li><li class="lichild">C2</li><li class="lichild">C3</li><li class="lichild">A6
<ul>
<li class="lichild">A8
<ul>
<li class="lichild">A10
<ul>
<li class="lichild"><a href="abc">A13</a>
</li><li class="lichild"><a href="fgh">A14</a>
</li></ul>
</li><li class="lichild"><a href="cde">A11</a>
</li></ul>
</li><li class="lichild"><a href="abcd">A9</a>
</li></ul>
</li><li class="lichild"><a href="nop">A7</a>
</li></ul>
</li><li class="limain">D
<ul>
<li class="lichild">D1</li>
<li class="lichild"><a href="klm">D2</a>
</li>
</ul>
</li>
</ul>

$(document).ready(function(){
  $(".lichild").parent().hide();

  $(".limain").click(function(){
    $(this).children('ul').show();
    $(this).siblings(".limain").children('ul').hide();
  });
  $(".lichild").click(function(){
    $(this).children('ul').show();
    $(this).siblings().children('ul').hide()
  });
});

推荐答案

（ document ）。ready （ function （）{

(document).ready(function(){

（ .lichild）。parent（）。hide（）;

(".lichild").parent().hide();

（ 。limain）。click（ function （）{

(".limain").click(function(){

这篇关于如何在jquery中隐藏子元素子元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！