<分区>
标签 javascript css
<分区>
我有这样一个页面 在左侧是这样的子菜单:
<div id="submenu1">Menu 1</div>
<div class="submenu2">Menu 2</div>
在右侧，我有与每个菜单相关联的内容窗口，如下所示
<div id="menuwindo1">Window associated with menu 1</div>
<div id="menuwindo2">Window associated with menu 2</div>
我的目标是当我们点击 Menu 1 div(在左边)时，它会显示相关的窗口，而当我们点击另一个菜单 div 时，它会出现这个窗口，同时让另一个窗口消失。
老实说，我不知道该怎么做...有什么建议吗？
我试图在其他帖子上找到它，但其他问题过于具体或给出的答案无效。
最佳答案
我已经演示了如何使用 jQuery 实现侧边子菜单导航栏和主内容窗口并在单击时切换内容。希望对您有所帮助。
$(document).ready(function() {
$("#submenu2").click(function() {
$("#window1").hide();
$("#window2").show();
});
$("#submenu1").click(function() {
$("#window2").hide();
$("#window1").show();
});
});.menu-navbar {
width: 20%;
height: 100vh;
background: red;
float: left;
}
#submenu1,
#submenu2 {
cursor: pointer;
background: white;
border:1px solid black;
}
.window {
height: 100vh;
background: gray;
text-align: center;
}
#window1 {
background: yellow;
}
#window2 {
background: green;
display: none;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="menu-navbar">
<div id="submenu1">Menu 1</div>
<div id="submenu2">Menu 2</div>
</div>
<div class="window">
<div id="window1">Content of submenu1Content of submenu1Content of submenu1Content of submenu1Content of submenu1Content of submenu1Content of submenu1Content of submenu1Content of submenu1Content of submenu1Content of submenu1Content of submenu1Content of submenu1Content
of submenu1Content of submenu1</div>
<div id="window2">Content of submenu2Content of submenu2Content of submenu2Content of submenu2Content of submenu2Content of submenu2Content of submenu2Content of submenu2Content of submenu2Content of submenu2Content of submenu2Content of submenu2Content of submenu2</div>
</div>关于javascript - 子菜单，使 div 出现，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47515503/