frame.js
$(function(){ $("#button").click(function(){ function resize_rect() { var browserWidth=$(window).width(); var browserHeight=$(window).height(); var winWidth=$("#info").width(); var winHeight=$("#info").height(); var scrollLeft=$(window).scrollLeft(); var scrollTop=$(window).scrollTop(); var left =scrollLeft+(browserWidth-winWidth)/2; var top =scrollTop+(browserHeight-winHeight)/2; $("#info").css("left",left); $("#info").css("right",top); } window.onresize = resize_rect; resize_rect(); $("#info").show(); }); $(".title img").click(function(){ $(this).parent().parent().hide(); }); $("#submit").submit(function(){ if(""==$("#name").val()){ alert("姓名不能为空!"); return false; } if(""==$("#pass").val()){ alert("密码不能为空!"); return false; }else{ alert("恭喜你,修改成功!"); return true; } }); });
frame.css
#main table{
border: 1px solid black;
width: 300px;
background:border-collapse: collapse;
}
.window{
background-color: gray;
width: 250px;
padding: 2px;
margin: 5px;
position: absolute;
display:none;
}
.content{
height:110px;
background-color: #ffffff;
overflow:auto;
}
.title{
text-align: center;
font-size: 20px;
}
.title img{
float:right;
width: 20px;
height:20px;
cursor:pointer;
}
#info{
position: absolute;
visibility: visible;
z-index: 2000;
}
login_success.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>用户登录成功</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link rel="stylesheet" type="text/css" href="css/frame.css">
<script type="text/javascript" src="js/jquery.js" charset="gb2312"></script>
<script type="text/javascript" src="js/frame.js" charset="gb2312"></script>
</head>
<body>
<h2>登录成功,欢迎${userid}光临!</h2>
<div id="main">
<table>
<thead>
<tr>
<th colspan="2">用户信息</th>
</tr>
</thead>
<tbody>
<tr>
<th>帐号:</th>
<td>${user.userid}</td>
</tr>
<tr>
<th>姓名:</th>
<td>${user.name}</td>
</tr>
<tr>
<th>密码:</th>
<td>${user.password}</td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<th><div id="button"><input type="button" value="修改"/></div></th>
<td></td>
</tr>
</tbody>
</table>
</div>
<div class="window" id="info">
<div class="title"><img alt="关闭" src="images/close.jpg">修改信息</div>
<div class="content">
<form action="updataInfo" method="post">
<table>
<tr>
<th>姓名:</th>
<td><input type="text" value="${user.name}"/></td>
</tr>
<tr>
<th>密码:</th>
<td><input type="text" value="${user.password}"/></td>
</tr>
<tr>
<td></td>
<td><input type="submit" value="保存"/><input type="reset" value="重置"/></td>
</tr>
</table>
</form>
</div>
</div>
</body>
</html>