You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

318 lines
6.7 KiB

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%
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="styles.css">
-->
</head>
<body>
<script src="js/jquery-1.11.3.js"></script>
<style>
*{
-moz-user-select: none; /*火狐*/
-webkit-user-select: none; /*webkit浏览器*/
-ms-user-select: none; /*IE10*/
-khtml-user-select: none; /*早期浏览器*/
user-select: none;
}
#back{
background-image:url('./img/login2.png');
background-repeat: no-repeat,no-repeat;
background-size:contain,contain;
background-position:0 150px;
height:100%;
width:100%;
}
.logback{
padding-top:0.5px;
border-radius:7px;
width:450px;
height:600px;
margin-left: 300px;
z-index: 6;
background: #F8F8FF;
opacity:0.95;
box-shadow:10px 10px 20px 10px rgba(220 ,220 ,220,0.5)
}
.loginform{
position: relative;
width:350px;
margin:auto auto;
margin-top: 12%;
}
.loginform .logtype{
text-align: center;
margin-bottom: 30px;
letter-spacing: 1px;
}
.loginform .logtype a{
margin-right: 10px;
font-weight: bold;
font-size: 23px;
cursor: pointer;
}
.loginform .logtype a:ACTIVE{
color:#EEAD0E;
}
form{
}
form .info{
margin-bottom: 20px;
width:100%;
height:43px;
border-radius:7px;
background: rgb(235 ,235, 235);
border: none;
text-indent: 15px;
letter-spacing: 1px;
font-size: 95%;
outline-color: #FFB90F;
}
form .info:FOCUS{
background: white;
}
select:FOCUS{
background: white;
outline-color: #FFB90F;
}
input::-moz-placeholder { /* Mozilla Firefox 4 to 18 适配火狐 */
color: rgb(180 ,180, 180);;
}
input::-webkit-input-placeholder { /* WebKit browsers 适配谷歌 */
color: rgb(180 ,180, 180);
}
.sub{
width:40%;
height:35px;
border-radius:7px;
border: none;
background: #FFB90F;
color: white;
font-size:120%;
letter-spacing: 4px;
display: inline;
vertical-align: top;
margin-top: 20px;
outline: none;
}
.sub:HOVER{
background: #EEAD0E;
}
.sub:ACTIVE{
background: #EEAD0E;
}
.reg{
display: inline-block;
vertical-align: top;
margin-left: 40%;
text-align: right;
margin-top: 20px;
}
.reg p{
font-size: 80%;
color: rgb(180 ,180, 180);
margin-top: 0px;
margin-bottom: 5px;
cursor: pointer;
}
.reg p:ACTIVE {
color: #EEAD0E;
}
select {
width:350px;
height:43px;
margin-bottom: 20px;
background: rgb(235 ,235, 235);
border: none;
}
#tip{
display: block;
}
</style>
<style>/*导航*/
/*
.newheader{
height: 60px;
background-color: #3CB371;
}
.head-nav{
height: 60px;
color: yellow;
position:relative;
left:-20px;
}
.head-nav #header-nav{
height: 60px;
color: yellow;
margin-top:0;
}
.logo{
}
.logo img{
height: 40px;
width: 40px;
float: left;
margin: auto 20px;
position:relative;
top:-10px;
}
.pr{
float: left;
margin: auto 10px;
}
.pr a{
color: white;
text-decoration: none;
position:relative;
top:20px;
}
.login{
height:60px;
}
*/
</style>
<!-- <div class="newheader">
<div class="head-nav pr" id="head-navpre1">
<ul id="header-nav">
<a class="logo">
<img alt="" src="./img/sLogo.png" >
</a>
<li class="pr" style="display: block;">
<a href="/paths" >跳蚤市场</a>
</li>
<li class="pr" style="display: block;">
<a href="/courses" >校园超市</a>
</li>
<li class="pr" style="display: block;">
<a href="/shixuns">失物招领</a>
</li>
<li class="pr" style="display: block;">
<a href="/competitions">资源共享</a>
</li>
<li class="pr" style="display: block;">
<a href="/moop_cases">兴趣论坛</a>
</li>
</ul>
</div>
<span class="login pr" style="float: right;">
<a href="" class="mr5 color-white" >登录</a>
<em class="vertical-line" ></em>
<a href="/register" class="mr5 color-white">注册</a>
</span>
</div>
-->
<div id="back" >
<div class="logback">
<div class="loginform">
<div class="logtype">
<a class="register">注册</a>
</div>
<s:form action="Register" method="post" autocomplete="on">
<s:textfield name="user.username" cssClass="info" placeholder="请使用用户名进行注册" /><br/>
<s:password name="user.password" cssClass="info" placeholder="设置新密码" id="pwd1" /><br/>
<input type="password" class="info" placeholder="再次输入密码" id="pwd2" required/ onkeyup="validate()"><br/>
<s:textfield name="user.age" label="年龄" />
<s:textfield name="user.email" label="Email地址" />
<a id="tip"><font color='red' style='visibility: hidden;'>12</font></a>
<input type="submit" id="submit" class="sub" onkeyup="" value="注册" />
<script>
function validate() {
var pwd1 = document.getElementById("pwd1").value;
var pwd2 = document.getElementById("pwd2").value;
console.log(pwd1);
if(pwd1 == pwd2) {
document.getElementById("tip").innerHTML="<font color='green'>√</font>";
if(document.getElementById("submit").disabled==null)
console.log("null");
else console.log("not null");
document.getElementById("submit").disabled = false;
document.getElementById("submit").style.background="#FFB90F";
console.log("same");
}else if(pwd2=="")
{
document.getElementById("tip").innerHTML="<font color='red' style='visibility: hidden;'>12</font>";
}
else {
console.log("same");
document.getElementById("tip").innerHTML="<font color='red'>两次密码不相同</font>";
document.getElementById("submit").disabled=true;
document.getElementById("submit").style.background="rgb(235 ,235, 235)";
}
}
</script>
<div class="reg">
<p>注册</p>
<p>忘记密码</p>
</div>
</s:form>
<p style="text-align: center;font-family:cursive;">———其他登录方式 ———</p>
</div>
</div>
<div>
<script type="text/javascript">
var h=document.getElementById("back").clientHeight;
var w=document.getElementById("back").clientWidth;
if(h==null) console.log(0);
console.log(h);
console.log(w);
</script>
</body>
</html>