<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title></title>
<link type="text/css" rel="stylesheet" href="css/layout.css" />
<script type="text/javascript" src="script/jquery-1.3.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
//新增员工
$("div.right dl.add dd").hide();
$("div.right dl.add dt").click(function(){
$(this).nextAll().toggle();
});
//表格
highlight();
hover();
$("table input").hide();
$("table tr span.button").click(function(){
if($(this).text() == "修 改"){
$(this).removeClass("modify").addClass("save").text("保 存");
$(this).parent().siblings().each(function(){
var tdSpanText = $(this).children("span").text();
$(this).children("span").text("").next("input").val(tdSpanText).show();
})
}
else if($(this).text() == "保 存"){
$(this).removeClass("save").addClass("modify").text("修 改");
$(this).parent().siblings().each(function(){
var tdInputText = $(this).children("input").val();
$(this).children("span").text(tdInputText).next("input").hide();
})
}
else if($(this).text() == "删 除"){
$(this).parents("tr").removeClass("even").hide();
highlight();
}
});
//隔行换色
function highlight(){
$("table tbody tr:visible").each(function(index){
$(this).removeClass("even");
if((index+1) % 2 == 0){
$(this).addClass("even");
}
});
}
//每行鼠标hover高亮
function hover(){
$("table tbody tr").hover(
function(){
$(this).addClass("hover");
},
function(){
$(this).removeClass("hover");
}
)
}
});
</script>
</head>
<body>
<div class="head">
<ul class="nav">
<li><span class="left"> </span><a href="book.html">图文资料管理</a><span class="right"> </span></li>
<li class="active"><span class="left"> </span><a href="employee.html">员工资料管理</a><span class="right"> </span></li>
<li><span class="left"> </span><a href="/borrow_book">图文借阅管理</a><span class="right"> </span></li>
<li><span class="left"> </span><a href="/notification">借阅到期通知</a><span class="right"> </span></li>
<li><span class="left"> </span><a href="/user">系统用户管理</a><span class="right"> </span></li>
</ul>
</div>
<div class="content clearfix">
<div class="left">
<h1><span>欢迎 <b>X 登</b> 登录</span></h1>
<ul>
<li><a href="/book">图文资料管理</a></li>
<li class="active"><a href="/employee">员工资料管理</a></li>
<li><a href="/borrow_book">图文借阅管理</a></li>
<li><a href="/notification">借阅到期通知</a></li>
<li><a href="/user">系统用户管理</a></li>
</ul>
</div>
<div class="right">
<h1>>>员工资料管理</h1>
<div class="pagination"><span class="disabled">前一页</span> <span class="current">1</span> <a href="#">2</a> ... <a href="#">101</a> <a href="#">102</a> <a href="#">下一页</a></div>
<table cellpadding="0" cellspacing="0">
<thead>
<tr>
<th>员工编号</th>
<th>员工姓名</th>
<th>电子邮箱</th>
<th>分机号码</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr>
<td><span>10001</span><input type="text" /></td>
<td><span>员工10001</span><input type="text" /></td>
<td><span>email10001@ibm.com</span><input type="text" class="long" /></td>
<td><span>10001</span><input type="text" /></td>
<td class="button">
<span class="button modify">修 改</span>
<span class="button">删 除</span>
</td>
</tr>
<tr>
<td><span>10001</span><input type="text" /></td>
<td><span>员工10001</span><input type="text" /></td>
<td><span>email10001@ibm.com</span><input type="text" class="long" /></td>
<td><span>10001</span><input type="text" /></td>
<td class="button">
<span class="button modify">修 改</span>
<span class="button">删 除</span>
</td>
</tr>
<tr>
<td><span>10001</span><input type="text" /></td>
<td><span>员工10001</span><input type="text" /></td>
<td><span>email10001@ibm.com</span><input type="text" class="long" /></td>
<td><span>10001</span><input type="text" /></td>
<td class="button">
<span class="button modify">修 改</span>
<span class="button">删 除</span>
</td>
</tr>
<tr>
<td><span>10001</span><input type="text" /></td>
<td><span>员工10001</span><input type="text" /></td>
<td><span>email10001@ibm.com</span><input type="text" class="long" /></td>
<td><span>10001</span><input type="text" /></td>
<td class="button">
<span class="button modify">修 改</span>
<span class="button">删 除</span>
</td>
</tr>
<tr>
<td><span>10001</span><input type="text" /></td>
<td><span>员工10001</span><input type="text" /></td>
<td><span>email10001@ibm.com</span><input type="text" class="long" /></td>
<td><span>10001</span><input type="text" /></td>
<td class="button">
<span class="button modify">修 改</span>
<span class="button">删 除</span>
</td>
</tr>
<tr>
<td><span>10001</span><input type="text" /></td>
<td><span>员工10001</span><input type="text" /></td>
<td><span>email10001@ibm.com</span><input type="text" class="long" /></td>
<td><span>10001</span><input type="text" /></td>
<td class="button">
<span class="button modify">修 改</span>
<span class="button">删 除</span>
</td>
</tr>
<tr>
<td><span>10001</span><input type="text" /></td>
<td><span>员工10001</span><input type="text" /></td>
<td><span>email10001@ibm.com</span><input type="text" class="long" /></td>
<td><span>10001</span><input type="text" /></td>
<td class="button">
<span class="button modify">修 改</span>
<span class="button">删 除</span>
</td>
</tr>
<tr>
<td><span>10001</span><input type="text" /></td>
<td><span>员工10001</span><input type="text" /></td>
<td><span>email10001@ibm.com</span><input type="text" class="long" /></td>
<td><span>10001</span><input type="text" /></td>
<td class="button">
<span class="button modify">修 改</span>
<span class="button">删 除</span>
</td>
</tr>
<tr>
<td><span>10001</span><input type="text" /></td>
<td><span>员工10001</span><input type="text" /></td>
<td><span>email10001@ibm.com</span><input type="text" class="long" /></td>
<td><span>10001</span><input type="text" /></td>
<td class="button">
<span class="button modify">修 改</span>
<span class="button">删 除</span>
</td>
</tr>
<tr>
<td><span>10001</span><input type="text" /></td>
<td><span>员工10001</span><input type="text" /></td>
<td><span>email10001@ibm.com</span><input type="text" class="long" /></td>
<td><span>10001</span><input type="text" /></td>
<td class="button">
<span class="button modify">修 改</span>
<span class="button">删 除</span>
</td>
</tr>
<tr>
<td><span>10001</span><input type="text" /></td>
<td><span>员工10001</span><input type="text" /></td>
<td><span>email10001@ibm.com</span><input type="text" class="long" /></td>
<td><span>10001</span><input type="text" /></td>
<td class="button">
<span class="button modify">修 改</span>
<span class="button">删 除</span>
</td>
</tr>
<tr>
<td><span>10001</span><input type="text" /></td>
<td><span>员工10001</span><input type="text" /></td>
<td><span>email10001@ibm.com</span><input type="text" class="long" /></td>
<td><span>10001</span><input type="text" /></td>
<td class="button">
<span class="button modify">修 �