1. The left side of the iframe is the <a> link, and the right side is the display page link content of the corresponding webpage nesting
<div class="container">
<div class="row">
<div class="col-lg-2">
<div class="list-group">
<a href="/paike/major/list" target="mainFrame" class="list-group-item">专业维护1</a>
<a href="/paike/course/list" target="mainFrame" class="list-group-item" >课程维护2</a>
<a href="/paike/manager/list" target="mainFrame" class="list-group-item">教务管理3</a>
<a href="/paike/teacher/list" target="mainFrame" class="list-group-item">老师维护4</a>
<a href="/paike/classes/list" target="mainFrame" class="list-group-item">班级维护5</a>
<a href="/paike/student/list" target="mainFrame" class="list-group-item">学生维护6</a>
<a href="www.W3School.com.cn" target="mainFrame" class="list-group-item">Class arrangement (finally, core business)</a>
</div>
</div>
<div class="col-lg-10" style="height:100%;">
<iframe src="welcome.jsp" id="mainFrame" name="mainFrame" style="border:0px;width:100%;height:100%;"></iframe>
</div>
</div>
</div>
here
name="mainFrame" to be used with
The name of target="mainFrame" is consistent with
2.toggle's retraction usage
<script>
$(function () {
$(".shouqi").click(function () {
// alert(1)
$("table").toggle();
});
})
</script>
</head>
<body>
<button class="shouqi"> Click me to close</button>
<table border="1">
<tr>
<td>Are you there?</td>
<td>Are you there?</td>
<td>Are you there?</td>
</tr>
<tr>
<td>Are you there?</td>
<td>Are you there?</td>
<td>Are you there?</td>
</tr>
<tr>
<td>Are you there?</td>
<td>Are you there?</td>
<td>Are you there?</td>
</tr>
</table>