Jquery动态 弹出窗口
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>&nbsp;</td><td>&nbsp;</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>
页:
[1]