<html>
<head>
<title>登录</title>
<link rel="stylesheet" type="text/css" href="register.css" />
<script language="javaScript">
function check()
{
var name = document.form1.name.value;
var password = document.form1.passWord.value;
var password2 = document.form1.passWord2.value;
var tel = document.form1.tel.value;
var email = document.form1.email.value;
if (name==""|| password==""||tel==""||email==""||safeanswer==""||password2=="")
{
alert("任意信息不能为空，请重新填写！");
return false;
}
else if(name.length> 12){
alert("用户名不能超过12个字符，请重新输入！");
return false;
}
else if(password.length<6){
alert("密码不能小于6个字符，请重新输入！");
return false;
}
else if (password!=password2)
{
alert("2次密码输入不一致！");
return false;
}
else if(tel.length > 20)
{
alert("联系方式长度不能超过20字符！");
return false;
}
else if (isNaN(tel))
{
alert("联系方式必须是数字");
return false;
}
else if (
email.length== 0 ||
email.charAt(0)=="." ||
email.charAt(0)=="@"||
email.indexOf('@', 0) == -1 ||
email.indexOf('.', 0) == -1 ||
email.lastIndexOf("@")==email.length-1 ||
email.lastIndexOf(".")==email.length-1)
{
alert("Email地址格式不正确！");
return false;
}
else{
return true;
}
}
function reset()
{
var r=confirm("确定重置？");
if (r==true)
{
alert("已重置！");
}
else
{
alert("请继续！");
}
}
</script>
</head>
<body>
<div id="formwrapper">
<h3> </h3>
<br/>
<form id=form1 name="form1" method = "post" action = "" onSubmit="return check()">
<fieldset>
<legend>新用户注册</legend>
<p><strong>我们保证您的信息不会被公布出去，请您如实填写.</strong></p>
<p>在您注册之前请先认真阅读服务条款.</p>
<div>
<label for="name">姓名</label>
<input type="text" name="name" class="input" id="name" size="20" maxlength="12" />
*(最多12个字符)<br/>
</div>
<div>
<label for="password">密码</label>
<input type="password" name="password" class="input" id="password" size="18" maxlength="15" />
*(最多15个字符)<br/>
</div>
<div>
<label for="password2">重复密码</label>
<input type="password" name="password2" class="input" id="password2" size="18" maxlength="15" />
*<br/>
</div>
<div>
<label for="tel">电话</label>
<input type="text" name="tel" class="input" id="tel" size="20" maxlength="20" />
*(请如实填写）<br/>
</div>
<div>
<label for="safequestion">密码保护问题</label>
<select name="safequestion" id="safe">
<option value="公司">您的公司所在城市？</option>
<option value="家乡">您的家乡所在省份？</option>
<option value="院校">您的毕业院校？</option>
</select>
*<br/>
</div>
<div>
<label for="safeanswer">密码保护答案</label>
<input type="text" name="safeanswer" id="answer" class="input" size="20" maxlength="150"/>
*<br/>
</div>
<div>
<label for="email">电子邮箱</label>
<input type="text" name="email" class="input"
id="email" size="20" maxlength="150" />
*<br/>
</div>
<div>
<label for="AgreeToTerms">同意服务条款</label>
<input type="checkbox" name="AgreeToTerms" id="AgreeToTerms" value="1" />
<a href="#" title="您是否同意服务条款">先看看条款？</a> * </div>
<div class="enter">
<input name="create791" type="submit" class="buttom" value="提交" />
<input name="Submit" type="reset" class="buttom" value="重置" onClick="reset()" />
</div>
<br/>
</fieldset>
</form>
<br/>
<h2>Small Birds</h2>
</div>
</body>
</html>
body {
font-family: Arial, Helvetica, sans-serif;
font-size:12px;
color:#666666;
background:#fff;
text-align:center;
}
* {
margin:0;
padding:0;
}
a {
color:#1E7ACE;
text-decoration:none;
}
a:hover {
color:#000;
text-decoration:underline;
}
h3 {
font-size:14px;
font-weight:bold;
}
pre,p {
color:#1E7ACE;
margin:4px;
}
input, select,textarea {
padding:1px;
margin:2px;
font-size:11px;
}
.buttom{
padding:1px 10px;
font-size:12px;
border:1px #1E7ACE solid;
background:#D0F0FF;
}
#formwrapper {
width:450px;
margin:15px auto;
padding:20px;
text-align:left;
border:1px solid #A4CDF2;
}
fieldset {
padding:10px;
margin-top:5px;
border:1px solid #A4CDF2;
background:#fff;
}
fieldset legend {
color:#1E7ACE;
font-weight:bold;
padding:3px 20px 3px 20px;
border:1px solid #A4CDF2;
background:#fff;
}
fieldset label {
float:left;
width:120px;
text-align:right;
padding:4px;
margin:1px;
}
fieldset div {
clear:left;
margin-bottom:2px;
}
.input {
width:120px
}
.enter{
text-align:center;
}
.clear {
clear:both;
}
