sub-menu, making a div appear

Question

我有这样的页面在左侧是这样的子菜单：

<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>

ma目标是让我们单击菜单1 Div（左侧）时，它会使相关窗口出现，当我们单击另一个菜单div时，它会使窗口显示在使另一个消失的同时。p>我不知道该怎么做...一些建议？

我试图在其他帖子上找到它，但是其他问题太具体了，或者给出的答案不起作用。

Answer 1

我已经展示了如何实现侧面子菜单导航栏和主内容窗口的想法，并使用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>