效果：
html:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<link rel="stylesheet" href="css/main.css" />
<body>
<div class="contrainer">
<!--头开始-->
<div class="top">
<!--头左开始-->
<div class="top_left">
<div class="top_left1">
<img src="img/logo.png" class="img"/>
</div>
<div class="top_left2">
<img src="img/zxw.png" class="imgstyle">
</div>
<div class="top_left3">
<img src="img/line.png" />
</div>
<div class="top_left4">
<span class="self">个人中心</span>
</div>
</div>
<!--头左结束-->
<!--头右开始-->
<div class="top_right">
<div class="top_right1">
<span class="user">您好，刘洋老师</span>
</div>
<div class="top_right2">
<img src="img/exit.png" class="img"/>
<span class="exit">退出</span>
</div>
</div>
<!--头右结束-->
</div>
<!--头结束-->
<!--main开始-->
<div class="main">
<!--左开始-->
<div class="main_left">
<!--左上6个提示链接开始-->
<div class="main_left_top">
<div class="btn1 btn" id="btn1"><a href="javascript:choose(1)" id="a1">个人信息</a></div>
<div class="btn2 btn" id="btn2"><a href="javascript:choose(2)" id="a2">我的资料</a></div>
<div class="btn3 btn" id="btn3"><a href="javascript:choose(3)" id="a3">账号安全</a></div>
<div class="btn4 btn" id="btn4"><a href="javascript:choose(4)" id="a4">班级管理</a></div>
<div class="btn5 btn" id="btn5"><a href="javascript:choose(5)" id="a5">教师管理</a></div>
<div class="btn6 btn" id="btn6"><a href="javascript:choose(6)" id="a6">家长信息</a></div>
</div>
<!--左上6个提示链接结束-->
<!--左下主体开始-->
<div class="main_left_bottom">
<div class="msg1 msg" id="msg1">这里为个人信息</div>
<div class="msg2 msg" id="msg2">这里为我的资料</div>
<div class="msg3 msg" id="msg3">这里为账号安全</div>
<!--
作者：offline
时间：2018-03-14
描述：班级管理开始
-->
<div class="msg4 msg" id="msg4">
<!--班级左边开始-->
<div class="class_left">
<div class="class_left1 leftstyle">
<div class="classselect" onclick="openGrades()"><span onclick="selectAllGrade()" id="grade">全部年级</span> <img src="img/down.png" class="img"/></div>
</div>
<!--隐藏的班级选择div开始-->
<div class="selectdiv" id="selectdiv">
</div>
<!--隐藏的班级选择div结束-->
<div class="class_left2 leftstyle" id="allClasses"><div>全部班级</div></div>
</div>
<!--班级左边结束-->
<!--班级右边开始-->
<div class="class_right">
<!--班级右边的上边开始-->
<div class="main_right_top">
<!--班级右边的上边 班级名称-->
<div class="main_right_top_left" >
<div id="classinfo" class="classinfo"></div>
</div>
<!--班级右边的上边 创建时间-->
<div class="main_right_top_mid" >
<div class="timeimg"><img src="img/clock.png" class="img"></div>
<div class="timetextinfo">创建时间：</div>
<div class="timetext" id="timetext"></div>
</div>
<!--班级右边的上边 添加学生-->
<div class="main_right_top_right">
<div class="add" id="add" onclick="add()">
<div>添加学生账号</div></div>
</div>
<!--隐藏的添加学生账号弹框-->
<div class="addstudent" id="addstudent">
<div class="addtop">
<div class="addtop_left">添加学生账号</div>
<div class="addtop_right">
<img src="img/cha.png" onclick="exitadd()" class="img"/>
</div>
</div>
<div class="addmain">
<div class="tablediv">
<table>
<tr>
<td> 姓 名 :</td>
<td><input type="text"></td>
</tr>
<tr>
<td>准考证号 : </td>
<td><input type="text"></td>
</tr>
<tr>
<td>学 籍 号 ： </td>
<td><input type="text"></td>
</tr>
<tr>
<td><div id="submit" class="submit"><div>确认</div></div></td>
<td><div id="cancle" class="cancle" onclick="cancle()"><div>取消</div></div></td>
</tr>
</table>
</div>
</div>
</div>
</div>
<!--班级右边的上边结束-->
<!--班级右边的中间开始-->
<div class="main_right_mid">
<!--班级教师-->
<div class="teacher_top">
<div class="teacher_top_left">班级教师</div>
<div class="teacher_top_right" onclick="over()" id="teacher_top_right">收起 <img src="img/jt.png" class="img"></div>
</div>
<div class="teacher_bottom">
<div class="teacherinfo" id="teacherinfo">
<table id="teachertable" class="teachertable">
<tr>
<th class="teacherfirst">科目</th>
</tr>
<tr>
<td>任课教师</td>
</tr>
</table>
</div>
</div>
</div>
<!--班级右边的中间结束-->
<!--班级右边的下边开始-->
<div class="main_right_bottom">
<!--学生人数-->
<div class="sumstudent" id="sumstudent">班级学生</div>
<!--学生表格-->
<div class="studenttablediv" id="studenttablediv">
<table class="studenttable" id="studenttable">
<tr>
<th></th>
<th>姓名</th>
<th>准考证号</th>
<th>学籍号</th>
<th>加长手机号</th>
<th>操作</th>
</tr>
</table>
</div>
<!--转班删除-->
<div class="studentoprationdiv">
<div class="zbdiv">
<div class="zb">转班</div>
</div>
<div class="deletediv">
<div class="delete">删除</div>
</div>
</div>
</div>
<!--班级右边的下边结束-->
</div>
<!--班级右边结束-->
</div>
<!--
作者：offline
时间：2018-03-14
描述：班级管理结束
-->
<div class="msg5 msg" id="msg5">这里为教师管理</div>
<div class="msg6 msg" id="msg6">这里为家长信息</div>
<div></div>
</div>
<!--左下主体结束-->
</div>
<!--左结束-->
<!--右开始-->
<div class="main_right">
<div class="main_right1">快捷操作</div>
<div class="main_right2 right">
<div class="mainimg">
<img src="img/addclass.png" class="img"/>
</div>
<div class="maintext"><span class="text">创立新班级</span></div>
</div>
<div class="main_right3 right">
<div class="mainimg"><img src="img/download.png" class="img" ></div>
<div class="maintext"><span class="text">下载学生名单</span></div>
</div>
<div class="main_right4 right">
<div class="mainimg"><img src="img/update.png" class="img"></div>
<div class="maintext"><span class="text">批量升级</span></div>
</div>
<div class="main_right5 right">
<div class="mainimg"><img src="img/bunchzb.png" class="img"></div>
<div class="maintext"><span class="text">批量转班</span></div>
</div>
</div>
<!--右结束-->
</div>
<!--main结束-->
<!--尾开始-->
<div class="bottom">
<div class="tail">皖ICP备05001217号科大讯飞股份有限公司版权所有
</div>
</div>
<!--尾结束-->
</div>
<!--灰色背景-->
<div id="black_overlay" class="black_overlay"></div>
</body>
<script type="text/javascript" src="js/jquery-3.2.1.min.js" ></script>
<script type="text/javascript" src="js/main.js" ></script>
</html>
css:
html {
width: 100%;
height: 100%;
margin: 0px;
}
body {
width: 100%;
height: 100%;
margin: 0px;
font-family: "微软雅黑";
}
/*灰色背景*/
.black_overlay {
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: #787878;
z-index: 1001;
-moz-opacity: 0.8;
opacity: .80;
filter: alpha(opacity=80);
}
/*div 个主体页面*/
.contrainer {
width: 100%;
height: 100%;
background-color: #2e363f;
}
/*div 头*/
.top {
width: 100%;
height: 6.8%;
}
/*div 中间*/
.main {
width: 100%;
height: 89%;
background-color: #f1f1f1;
}
.bottom {
width: 100%;
height: 4.2%;
text-align: center;
font-size: 10%;
color: #565e67;
}
.tail{
}
/*div 中间的左边*/
.top_left {
margin-left: 24%;
float: left;
width: 13%;
height: 100%;
}
/*中间的右边*/
.top_right {
float: right;
width: 10%;
height: 100%;
margin-right: 24%;
}
/*div 头 放logo*/
.top_left1 {
width: 23%;
height: 98%;
margin-top: 3%;
background-color: #32bb9f;
float: left;
}
.top_left1 img{
padding-top: 10%;
}
/*div 头 放智学网图片*/
.top_left2 {
width: 25%;
height: 80%;
float: left;
margin-left: 8%;
margin-top: 5%;
vertical-align: middle;
}
.top_left2 img{
width: 100%;
height: 73%;
}
/*div 头 放竖线图片*/
.top_left3 {
width: 1%;
height: 100%;
float: left;
margin-left: 8%;
margin-top: 5%;
}
/*div 头 写 个人中心*/
.top_left4 {
margin-left: 7%;
width: 28%;
height: 80%;
float: left;
margin-top: 5%;
line-height: 100%;
text-align: center;
word-break: keep-all;
/* 不换行 */
white-space: nowrap;
/* 不换行 */
}
.img {
max-width: 100%;
max-height: 100%;
}
.self {
font-size: 8%;
color: #ffffff;
}
.user {
font-size: 8%;
color: #318375;
}
/*div 退出图片*/
.top_right1 {
margin-top: 5%;
width: 70%;
height: 100%;
float: left;
word-break: keep-all;
/* 不换行 */
white-space: nowrap;
/* 不换行 */
}
/*div 退出*/
.top_right2 {
margin-top: 5%;
width: 20%;
height: 100%;
margin-left: 10%;
float: left;
word-break: keep-all;
/* 不换行 */
white-space: nowrap;
/* 不换行 */
}
.exit {
font-size: 8%;
color: #717983;
}
.main_left{
width:52%;
height: 83%;
margin-top: 3%;
margin-left: 24%;
float:left;
background-color: #ffffff;
}
.main_right{
width: 6%;
height: 45%;
float:left;
margin-top: 12%;
margin-left: 1%;
background-color: #ffffff;
}
.main_right1{
width: 100%;
height: 11%;
font-size: 8%;
word-break: keep-all;
/* 不换行 */
white-space: nowrap;
/* 不换行 */
text-align: center;
vertical-align: middle;
color: #8c8c8c;
border: 1px solid #e1e1e1;
box-sizing: border-box;
}
.right{
width: 100%;
height: 22%;
border: 1px solid #e1e1e1;
border-top: none;
box-sizing: border-box;
word-break: keep-all;
/* 不换行 */
white-space: nowrap;
/* 不换行 */
color: #8c8c8c;
text-align: center;
background-color: #ffffff;
}
.mainimg{
width: 38%;
height: 37%;
margin-left: 32%;
//margin-top: 19%;
padding-top: 19%;
}
.maintext{
text-align: center;
width: 80%;
}
.maintext span{
font-size: 0.000001%;
}
.main_left_top{
width: 100%;
height: 6%;
background-color: #f9f9f9;
}
.btn{
width: 12.5%;
height: 100%;
text-align: center;
float:left;
border-left: 1px solid #f1f1f1;
box-sizing: border-box;
}
a{
text-decoration: none;
font-size: 10%;
}
a:link{
color: #656565;
}
a:visited{
color: #656565;
}
.main_left_bottom{
width: 100%;
height: 94%;
}
/*div 中间可变区域*/
.msg{
width: 100%;
height: 100%;
}
/*班级管理的左边*/
.class_left{
height: 100%;
width: 14%;
float:left;
}
/*div 年级选择*/
.class_left1{
margin-top: 20%;
width: 100%;
height: 5%;
text-align: center;
font-size: 80%;
}
.class_left1 div{
cursor: pointer;
}
/*div 班级左边的小项统一样式*/
.leftstyle{
border-bottom: 1px solid #f1f1f1;
width: 100%;
font-size: 10%;
text-align: center;
height: 7%;
color: #8c8c8c;
}
/*div 选择年级弹出的选择框*/
.selectdiv{
position: absolute;
left: 24%;
width: 7%;
height: auto;
border: 1px solid #cecece;
background-color: #ffffff;
box-sizing: border-box;
/*text-align: center;*/
}
/*div 选择年级弹出的选择框的每一个小项统一样式*/
.grades{
border-bottom: 1px solid #f1f1f1;
font-size: 10%;
cursor: pointer;
color: #666666;
}
.classselect span{
color: #666666;
font-weight: bold;
}
/*每个班级项*/
.alreadyclass{
cursor: pointer;
}
.leftstyle div{
padding-top: 8%;
}
#grade0{
background-color: #33ba9f;
}
/*div 班级右边详情*/
.class_right{
width: 80%;
height:86% ;
margin-left: 3%;
margin-top: 3%;
float: left;
}
/*div 班级右边详情的上边*/
.main_right_top{
width: 100%;
height: 15%;
border: 1px solid #dcdcdc;
border-bottom: 2px solid #dbdbdb;
box-sizing: border-box;
}
/*div 班级右边详情的中间*/
.main_right_mid{
width: 100%;
height: 27%;
margin-top: 3%;
border: 1px solid #dcdcdc;
border-bottom: 2px solid #dbdbdb;
box-sizing: border-box;
}
/*div 班级右边详情的下边*/
.main_right_bottom{
width: 100%;
height: 51%;
margin-top: 4%;
border: 1px solid #dcdcdc;
border-bottom: 2px solid #dbdbdb;
box-sizing: border-box;
}
/*div 班级右边的上边 班级名称*/
.main_right_top_left{
text-align: center;
height: 100%;
width: 24%;
font-size: 10%;
vertical-align: middle;
border-right: 1px dotted #dedede;
box-sizing: border-box;
float: left;
}
.classinfo{
padding-top: 15%;
color: #606060;
font-weight: bold;
}
/*div 创建时间和时钟图片*/
.main_right_top_mid{
width:50% ;
margin-left: 5%;
height: 100%;
float: left;
text-align: center;
font-size: 10%;
}
.timetextinfo{
margin-left: 10%;
float: left;
margin-top: 5%;
color: #a7a7a7;
}
.timeimg{
margin-top: 5%;
float: left;
}
.timetext{
text-align: center;
margin-top: 5%;
float: left;
}
.main_right_top_right{
height: 100%;
width: 20%;
float: left;
}
/*div 添加学生账号*/
.add{
cursor: pointer;
color: #ffffff;
text-align: center;
margin-top:10% ;
width: 85%;
height: 43%;
font-size: 10%;
word-break: keep-all;
/* 不换行 */
white-space: nowrap;
/* 不换行 */
background-color: #33ba9f;
border-radius: 5%;
}
.add div{
padding-top: 3%;
}
/*div 添加学生账号弹框*/
.addstudent{
display: none;
top:30%;
left: 34%;
position: absolute;
display: none;
width: 32%;
height: 39%;
background-color: #ffffff;
z-index: 1002;/*当背景灰色的时候此图层可以显示*/
overflow: auto;
}
.addtop{
width: 100%;
height: 12%;
background-color: #33ba9f;
}
.addtop_left{
float: left;
width: 15%;
height: 100%;
text-align: center;
font-size: 15%;
margin-left: 5%;
word-break: keep-all;
/* 不换行 */
white-space: nowrap;
/* 不换行 */
margin-top: 2%;
color: #ffffff;
}
.addtop_right{
float: right;
margin-top: 1%;
margin-right: 3%;
}
.addmain{
width: 100%;
height: 88%;
background-color: #ffffff;
}
.tablediv{
margin-left: 25%;
width: 53%;
height: 61%;
padding-top: 10%;
}
table{
width: 100%;
height: 100%;
}
td{
color: #adadad;
font-size: 10%;
word-break: keep-all;
/* 不换行 */
white-space: nowrap;
/* 不换行 */
}
.submit{
height: 90%;
text-align: center;
border-radius: 5%;
background-color: #33ba9f;
color: #ffffff;
width: 100%;
}
.submit div{
padding-top: 10%;
}
.cancle{
height: 90%;
text-align: center;
border: 1px solid #999999;
border-radius: 10%;
background-color: #ffffff;
color: #adadad;
width: 40%;
margin-left: 20%;
}
.cancle div{
padding-top: 10%;
}
/*div 教师信息上边*/
.teacher_top{
width: 100%;
height: 32%;
}
.teacher_bottom{
width: 100%;
height: 68%;
}
/*div 写班级教师*/
.teacher_top_left{
margin-top: 2%;
float: left;
margin-left: 3%;
font-size: 10%;
color: #888888;
}
/*div 写收起*/
.teacher_top_right{
margin-top: 2%;
color: #b6b6b6;
float: right;
margin-right: 3%;
font-size: 10%;
cursor: pointer;
}
/*div 教师列表*/
.teacherinfo{
width: 95%;
height: 83%;
margin-left: 2%;
border: 1px solid #dbdbdb;
box-sizing: border-box;
}
.teachertable{
text-align: center;
width: 100%;
height: 100%;
}
.teachertable th{
font-size: 10%;
color: #474747;
background-color: #f1f1f1;
}
/*教师表格的头*/
.teacherfirst{
width: 10%;
}
.teachertable td{
border-right: 1px solid #e6e6e6;
color: #9c9c9c;
box-sizing: border-box;
}
.teacher{
cursor: pointer;
}
/*div 学生人数*/
.sumstudent{
width: 90%;
height: 17%;
margin-top: 2%;
margin-left: 3%;
font-size: 10%;
color: #888888;
}
/*span 学生人数的样式*/
.countstudent{
color: #b6b6b6;
font-size: 10%;
}
/*div 学生表格*/
.studenttablediv{
height: 56%;
width: 95%;
margin-left: 2%;
}
/*div 写转班删除*/
.studentoprationdiv{
width: 100%;
height: 25%;
}
/*table 学生表格*/
.studenttable{
width: 100%;
height: 100%;
text-align: center;
}
.studenttable th{
font-size: 10%;
color: #474747;
background-color: #f1f1f1;
}
.studenttable td{
border-right: 1px solid #e6e6e6;
color: #9c9c9c;
box-sizing: border-box;
}
.studenttable tr{
border: 1px solid #e6e6e6;
color: #9c9c9c;
box-sizing: border-box;
}
.studenttable a:link{
color: #6ec9b5;
}
.studenttable a:visited{
color: #6ec9b5;
}
/*div 转班*/
.zbdiv{
margin-left: 5%;
margin-top: 2%;
width: 11%;
text-align: center;
background-color:#33ba9f ;
height: 42%;
float: left;
border-radius: 5%;
text-align: center;
font-size: 10%;
color: #f6fbfa;
}
/*div 删除*/
.deletediv{
margin-left: 5%;
margin-top: 2%;
width: 11%;
height: 42%;
text-align: center;
background-color: #ffffff;
float: left;
border-radius: 10%;
text-align: center;
font-size: 10%;
border: 1px solid #999999;
box-sizing: border-box;
color: #8a8a8a;
}
.zbdiv div{
}
.deletediv div{
}
.box{
color: #33ba9f;
background-color: #33ba9f;
border: 1px solid #33ba9f;
box-sizing: border-box;
}
/*改变复选框样式*/
/*首先第一步就是隐藏原来的复选框*/
.regular-checkbox {
display: none;
}
/*第二部定义现在复选框样式*/
.regular-checkbox + label {
position: relative;
display: inline-block;
/*lable是内联元素所以需要加inline-block*/
padding: 7px;
/*设置复选框大小*/
background-color: #fafafa;
/*设置背景颜色*/
border-radius: 3px;
/*复选框border*/
border: 1px solid #33ba9f;
box-shadow: 0 1px 3px rgba(0,0,0,0.5);
/*创建的阴影效果 这里需要了解box-shadow的属性，前三个值分别是
阴影离开横方向的距离 :offset-x
阴影离开纵方向的距离 ：offset-y
阴影的模糊半径：
阴影的颜色 ：
*/
}
/*第三部分做一个active的效果*/
.regular-checkbox + label:active, .regular-checkbox + label:checked + label:active {
box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
/*选中之后的样式*/
.regular-checkbox:checked + label {
background-color: #E9ECEE;
box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}
/*选中后的效果*/
.regular-checkbox:checked + label:after {
content: '\2714';
/*这是一个对勾*/
position: absolute;
font-size: 12px;
/*设置对勾的大小*/
top: 0px;
left: 2px;
/*设置位置的偏向*/
color: #33ba9f;
/*设置颜色绿色*/
font-weight: bold;
/*设置对勾的粗细*/
}
js:
var grade;//年级json
var distinctGrade;//所有年级
var selectgrade="全部年级";//当前选择的年级
var selectclass="";//当前选择的班级
var flag=true;//教师信息默认展开
function init(){
//a标签默认选中
choose(4);
//获取所有年级
$.get("data/grade.json",function(data){
distinctGrade=data;
})
//获取所有班级信息
$.get("data/classes.json",function(data){
grade=data;
//默认选择全部年级
selectClasses(selectgrade);
//默认选择全部年级的第一个班级
clickClass(0);
})
}
$(function(){
init();
})
//a标签点击事件
function choose(v){
//清空样式
for(var i=1;i<=6;i++){
$("#btn"+i).css("border-top","none");
$("#msg"+i).css("display","none");
$("#btn"+i).css("background-color","#f9f9f9");
}
//选中样式
$("#btn"+v).css("border-top","2px solid #33ba9f");
$("#msg"+v).css("display","block");
$("#btn"+v).css("background-color","#ffffff");
}
//选择年级弹框
function openGrades(){
$("#selectdiv").css("display","block");
var str='<div class="grades" onclick="selectGrade('+0+')" id="grade0">'+"全部年级"+'</div>';
//填充年级数据
for(var i=1;i<=distinctGrade.length;i++){
str+='<div class="grades" onclick="selectGrade('+i+')" id="grade'+i+'">'+distinctGrade[i-1].grade+'</div>';
}
$("#selectdiv").html(str);
$("#selectdiv").css("border-bottom","3px solid #33ba9f");
/*
//选择年级的鼠标移入事件
for(var j=0;j<=distinctGrade.length;j++){
$("#grade"+j).mouseover(function(){
//alert("移入");
$("#grade"+j).css("background-color","red");
})
$("#grade"+j).mouseout(function(){
//alert("移入");
$("#grade"+j).css("background-color","blue");
})
}*/
}
//选择年级项
function selectGrade(i){
//清空选择标记
//$(".grades").css("background-color","#ffffff");
$("#grade"+i).css("background-color","#33ba9f");
if(i==0){
$("#grade").html("全部年级");
selectgrade="全部年级";
}else{
$("#grade").html(distinctGrade[i-1].grade);
selectgrade=distinctGrade[i-1].grade;
}
$("#selectdiv").css("display","none");
selectClasses(selectgrade);
}
//选择年级来填充班级
function selectClasses(selectgrade){
//alert(selectgrade);
var str="";
//填充班级数据
if(selectgrade=="全部年级"){
for(var i=0;i<grade.length;i++){
str+=' <div class="class_left2 leftstyle alreadyclass" id="rclass'+i+'" onclick="clickClass('+i+')"><div>'+grade[i].class+'</div></div>';
}
}else{
for(var i=0;i<grade.length;i++){
if(selectgrade==grade[i].grade){
str+=' <div class="class_left2 leftstyle alreadyclass" id="rclass'+i+'" onclick="clickClass('+i+')"><div>'+grade[i].class+'</div></div>';
}
}
}
$(".alreadyclass").remove();
$("#allClasses").after(str);
}
//点击班级 事件 -->填充右边信息
function clickClass(i){
$(".alreadyclass").css("background-color","#ffffff");//清空点击标记
$("#rclass"+i).css("background-color","#33ba9f");
selectclass=grade[i].class;
var time=grade[i].time;
//班级名称
$("#classinfo").html(selectclass);
//创建时间
$("#timetext").html(time);
//科目和任课教师
$.get("data/teacher.json",function(data){
var str1='<tr><th class="teacherfirst">科目</th>';//第一行
var str2='<tr><td>任课教师</td>';//第二行
for(var i=0;i<data.length;i++){
if(selectclass==data[i].class){
str1+='<th>'+data[i].subject+'</th>';
str2+='<td onclick="changeteacher()" class="teacher">'+data[i].teacher+'</td>';
}
}
str1+='</tr>';
str2+='</tr>';
str1+=str2;
$("#teachertable").html(str1);
})
//学生信息
$.get("data/student.json",function(data){
var sum=0;//学生总数
var student='';//学生表格
for(var i=0;i<data.length;i++){
if(selectclass==data[i].class){
sum++;
student+='<tr class="newstudent">';
student+='<td><input type="checkbox" id="check'+i+'" class="regular-checkbox"><label for="check'+i+'"></label></td>';
student+='<td>'+data[i].student+'</td>';//姓名
student+='<td>'+data[i].testid+'</td>';//准考证号
student+='<td>'+data[i].studyid+'</td>';//学籍号
student+='<td>'+data[i].phone+'</td>';//
student+='<td><a href="">修改</a> '+'<a href="">重置密码</a>'+'</td>';
student+='</tr>';
}
}
//学生人数
$(".countstudent").remove();//先清除
var str='<span class="countstudent">'+'(学生人数 : '+sum+')'+'</span>';
$("#sumstudent").append(str);
//学生表格
$(".newstudent").remove();//先清除
$("#studenttable").append(student);
})
}//填充结束
//更新老师
function changeteacher(){
alert("更新教师");
}
//添加学生账号弹框
function add(){
$("#addstudent").css("display","block");
$("#black_overlay").css("display","block");
}
//关闭窗口
function exitadd(){
$("#addstudent").css("display","none");
$("#black_overlay").css("display","none");
}
//取消
function cancle(){
exitadd();
}
//教师信息收起
function over(){
var str="";
if(flag){
//展开
str='展开 <img src="img/jtup.png" class="img">';
flag=false;
}else{
str='收起 <img src="img/jt.png" class="img">';
flag=true;
}
$("#teacher_top_right").html(str);
$("#teacherinfo").toggle(500);
}