标签:logs abs ack 界面 pass span doc script title
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用户登录</title>
<style type="text/css">
#div0{
width: 600px;
height: 250px;
position: absolute;
}
#div1{
width: 320px;
height: 250px;
position: absolute;
left: 600px;
}
/*判断是否输入*/
#div2{
width: 300px;
height: 30px;
position: absolute;
left: 920px;
top:70px;
}
</style>
<script type="text/javascript">
/*判断用户名*/
function judge(){
var div2 = document.getElementById("div2");
div2.style.fontSize="15px";
var userName = document.getElementById("userName").value;
var rule = /^[a-zA-Z]{3}/; /*前三个字符为字母*/
if(rule.test(userName)){
div2.style.color="green";
div2.innerHTML="格式正确";
}else{
div2.style.color="red";
div2.innerHTML="前三个字符必须为字母";
}
}
function subm(name){
var rule = /^[a-zA-Z]{3}/;
if(rule.test(name.value)){
return true;
}else{
return false;
}
}
</script>
</head>
<body>
<div id="all">
<div id="div0">
</div>
<div id="div1">
<form action="http://www.baidu.com" method="get" onsubmit="return subm(this.userName)">
<table align="center" width="300px">
<tr align="center">
<td colspan="2">
<span style="font-size: 20px;">论坛用户帐号登录</span><hr />
</td>
</tr>
<tr>
<td colspan="2"></td>
</tr>
<tr>
<td>
<span style="font-size: 18px;">用户名:</span>
</td>
<td>
<input type="text" name="userName" id="userName" onblur="judge()" style="height: 30px;width: 220px;font-size: 20px;"/>
</td>
</tr>
<tr>
<td colspan="2"></td>
</tr>
<tr>
<td>
<span style="font-size: 18px;">密 码:</span>
</td>
<td>
<input type="password" name="password" style="height: 30px;width: 220px;font-size: 20px;"/>
</td>
</tr>
<tr>
<td colspan="2"></td>
</tr>
<tr align="right">
<td colspan="2">
<a href="toRegister.do?opt=toRegister" id="a_1">立即注册</a>
</td>
</tr>
<tr>
<td colspan="2">
<input type="submit" value="登 录" style="background-color: #2894FF;color: white;width: 300px;height: 50px;font-size: 20px;"/>
</td>
</tr>
</table>
</form>
</div>
<div id="div2">
</div>
</div>
</body>
</html>
标签:logs abs ack 界面 pass span doc script title
原文地址:http://www.cnblogs.com/syj1993/p/6865673.html