Javascript 如何切换菜单中的子菜单项

我无法使以下代码正常工作。 我有一份简单的菜单。 其中一项包含子菜单。 我希望它在单击该项目时折叠和解压。 出于某种原因，它只展开第一个子项，而不展开其余子项。 我找不到类似的线索，这就是为什么我在这里提出我的问题

欢迎一切帮助

功能切换子菜单（e）{
e、 切换（“活动”）；
var面板=e.nextElementSibling；
if（panel.style.maxHeight）{
panel.style.maxHeight=null；
}否则{
panel.style.maxHeight=panel.scrollHeight+“px”；
}
}

.c菜单{
位置：绝对位置；
宽度：200px；
边际：0px；
填充：0；
背景色：#fff；
左边框：1px实心#CBCBCB；
右边框：1px实心#CBCBCB；
盒影：0 10px 20px rgba（0,0,0,0.19），0 6px 6px rgba（0,0,0,0.23）；
}
.c-menu ul{
列表样式类型：无；
背景色：#fff；
颜色：#444；
光标：指针；
填充物：5px；
宽度：100%；
高度：35px；
边界：无；
边框底部：1px实心#CBCBCB；
文本对齐：左对齐；
大纲：无；
字体大小：15px；
过渡：0.4s；
}
.c-菜单ul.激活，
.c菜单ul：悬停{
背景色：#EAEAEA；
}
.c-子菜单{
列表样式：无；
保证金：0；
填充：0；
}
.c-子菜单li{
边框底部：1px实心#CBCBCB；
高度：35px；
字体大小：14px；
填充：10px039px；
光标：指针；
}
.c-子菜单li：悬停{
背景色：#EAEAEA；
}
c小组{
背景色：白色；
最大高度：0；
溢出：隐藏；
过渡段：最大高度0.2s放松；
}

A
B
C
打开

AA
BB
抄送
DD

您需要切换

面板.style.overflow

属性

功能切换子菜单（e）{
e、 切换（“活动”）；
var面板=e.nextElementSibling；
if（panel.style.maxHeight）{
panel.style.maxHeight=null；
panel.style.overflow=“隐藏”；
}否则{
panel.style.maxHeight=panel.scrollHeight+“px”；
panel.style.overflow=“可见”；
}
}

.c菜单{
位置：绝对位置；
宽度：200px；
边际：0px；
填充：0；
背景色：#fff；
左边框：1px实心#CBCBCB；
右边框：1px实心#CBCBCB；
盒影：0 10px 20px rgba（0,0,0,0.19），0 6px 6px rgba（0,0,0,0.23）；
}
.c-menu ul{
列表样式类型：无；
背景色：#fff；
颜色：#444；
光标：指针；
填充物：5px；
宽度：100%；
高度：35px；
边界：无；
边框底部：1px实心#CBCBCB；
文本对齐：左对齐；
大纲：无；
字体大小：15px；
过渡：0.4s；
}
.c-菜单ul.激活，
.c菜单ul：悬停{
背景色：#EAEAEA；
}
.c-子菜单{
列表样式：无；
保证金：0；
填充：0；
}
.c-子菜单li{
边框底部：1px实心#CBCBCB；
高度：35px；
字体大小：14px；
填充：10px039px；
光标：指针；
背景色：白色；
}
.c-子菜单li：悬停{
背景色：#EAEAEA；
}
c小组{
背景色：白色；
最大高度：0；
溢出：隐藏；
过渡段：最大高度0.2s放松；
}

A
B
C
打开

AA
BB
抄送
DD