<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>管理系统</title>
<script src="js/jq.3.2.1.js"></script>
<style>
body,ul,li,*{margin: 0;padding: 0;}
a{text-decoration: none;}
ul,dl,ol{list-style: none;}
.nav{ width: 100%;height: 20%;background: aquamarine;font-size: 20px;text-align: center;font-weight: bold;}
.cont{ width: 100%;height: 80px;background: #ccc;}
.cont .co-li{float: left;width: 30%;height: 1000px;background: #a0d3e8;}
.cont .co-ri{float: right;width: 70%;height: 1000px;background: #2a5d84;}
.co-li ul {margin: 80px 0 0 180px;}
.co-li ul li{margin: 50px 50px;}
</style>
</head>
<body>
<div class="box">
<div class="nav">管理系统界面</div>
<div class="cont">
<div class="co-li">
<ul>
<li><a>添加教师</a></li>
<li><a>添加学生</a></li>
<li><a>添加课程</a></li>
<li><a>添加成绩</a></li>
</ul>
</div>
<div class="co-ri"></div>
</div>
</div>
<script>
$(document).ready(function(){
$(".co-li ul li").click(function(){
$(".co-ri").load("tea-add.php")
});
});
</script>
</body>
</html>第一次刷新;<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <script src="js/jq.3.2.1.js"></script> <title>添加教师</title> <style> .teacher{width: 80%;height: 100%;} </style></head><body><div class="teacher"> <form action="" method="get"> 教师名称:<input type="text" name="tea-name"/><br> <input class="add" type="submit" value="提交"/> </form></div><script> $(document).ready(function(){ $(".add").click(function(){ alert(123) $(".co-ri").load("manage.html"); }); });</script></body></html>第二次空白页
添加回答
举报
0/150
提交
取消