切换divs-javascript

（我的java脚本在basic下，我正在学习过程中） 我正在尝试使用我在这里找到的脚本的一些复制粘贴制作菜单导航，但结果并不像我希望的那样完美

这就是重点，我想：

单击一个–div–

显示其–ul–中的–li–

其他–div–隐藏

单击–li–链接不会显示其他–div-，它们会保持隐藏状态

单击返回相同的–div–

所有人——李——隐藏起来

显示所有其他–div–和–ul–（而不是–li–）

希望问题是清楚的，我感谢任何评论

谢谢

$（文档）.ready（函数（）{
$（“ul”）。单击（函数（evt）{
如果（evt.target.tagName！=“UL”）
返回；
$（“li”，this.toggle（）；
});
});
$（“.SHOW”）。单击（函数（）{
$（this.sides（“div”）.toggle（）；
});
ulli{列表样式：无；}
a{文本装饰：无；}
ul a{颜色：黑色；}
LIA{color:#493A3A；；}
.GER、.ARG、.西班牙{
位置：绝对位置；
宽度：200px；
文本对齐：居中；
边框：实心2倍灰色；
保证金：0；
填充：0；
字体大小：30px；
线高：40px；
}
.ARG{左：220px；上：8px}
.西班牙{左：431px；顶：8px}
.GERLI、.ARGLI、.SPALI{字体大小：18px；高度：35px；行高：36px；显示：无}
格丽：第n个孩子（1）{背景色：黄色；}
格丽：第n个孩子（2）{背景色：红色；}
格丽：第n个孩子（3）{背景色：黑色；}
.ARGLI:nth child（1）{背景色：浅蓝色；}
.ARGLI:n子（2）{背景色：白色；}
.ARGLI:nth child（3）{背景色：浅蓝色；}
.SPALI:nth child（1）{背景色：红色；}
.SPALI:nth child（2）{背景色：黄色；}
.SPALI:nth child（3）{背景色：红色；}
.GER:hover、.ARG:hover、.西班牙：hover{背景色：浅灰色；}

德国




阿根廷




西班牙




您不认为这些是框，当您单击一个li时，实际上是在单击整个ul和div。您不仅需要指定要单击的内容，还需要开始使用ID，类只能使用javascript。我把它修好了


$（文档）.ready（函数（）{
$（“ul”）。单击（函数（evt）{
如果（evt.target.tagName！=“UL”）
返回；
$（“li”，this.toggle（）；
});
});
$（“.GER”）。单击（函数（e）{
如果（e.target.id==“GER”）
$（this.parent（）.sides（“div”）.toggle（）；
});
$（“.ARG”）。单击（函数（e）{
如果（e.target.id==“ARG”）
$（this.parent（）.sides（“div”）.toggle（）；
});
$（“.SPAIN”）。单击（函数（e）{
如果（e.target.id==“SPA”）
$（this.parent（）.sides（“div”）.toggle（）；
});
ulli{列表样式：无；}
a{文本装饰：无；}
ul a{颜色：黑色；}
LIA{color:#493A3A；；}
.GER、.ARG、.西班牙{
位置：绝对位置；
宽度：200px；
文本对齐：居中；
边框：实心2倍灰色；
保证金：0；
填充：0；
字体大小：30px；
线高：40px；
}
.ARG{左：220px；上：8px}
.西班牙{左：431px；顶：8px}
.GERLI、.ARGLI、.SPALI{字体大小：18px；高度：35px；行高：36px；显示：无}
格丽：第n个孩子（1）{背景色：黄色；}
格丽：第n个孩子（2）{背景色：红色；}
格丽：第n个孩子（3）{背景色：黑色；}
.ARGLI:nth child（1）{背景色：浅蓝色；}
.ARGLI:n子（2）{背景色：白色；}
.ARGLI:nth child（3）{背景色：浅蓝色；}
.SPALI:nth child（1）{背景色：红色；}
.SPALI:nth child（2）{背景色：黄色；}
.SPALI:nth child（3）{背景色：红色；}
.GER:hover、.ARG:hover、.西班牙：hover{背景色：浅灰色；}

德国




阿根廷




西班牙