您的位置：首页 > Web前端 > JavaScript

注册界面用javascript检查输入信息格式是否正确完整版

2014-01-25 19:19 471 查看

<html>
<head>
<title>register.html</title>

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<link rel="stylesheet" type="text/css" href="register.css">

<script type="text/javascript" language = "javascript">

var allforms = document.forms;

function check(){

//单击一次提交  调用函数之前先清掉上一次的检查信息。
userNameSpan.innerText = "";
pswSpan.innerText = "";
surePswSpan.innerText = "";
ageSpan.innerText = "";
emailSpan.innerText = "";
telSpan.innerText = "";
//用户名 检查
var len = allforms[0].userName.value.length;
if(len<4 || len>6){
//window.alert("1");
userNameSpan.innerText = "用户名应该是4-6位";
//window.alert("2");
return false;
}
//密码检查
len = allforms[0].psw.value.length;
if(len<3){
pswSpan.innerText = "密码位数最少3位";
return  false;
}else{
if(allforms[0].psw.value != allforms[0].sureName.value){
surePswSpan.innerText = "两次密码输入的不一致";
return  false;
}
}

//检查年龄
var age = allforms[0].age.value;
var myReg = /(\d){1,2}/gi;
if(!myReg.test(age)){
ageSpan.innerText = "年龄范围是0-99";
return false;
}

//电子邮箱检查
var con = allforms[0].emailName.value;
var myReg = /^[a-zA-Z0-9_-]+@([a-zA-Z0-9]+\.)+(com|cn|org|net)$/gi;
if(!myReg.test(con)){
emailSpan.innerText = "不是电子邮箱";
return false;
}

//检查电话号码
var tel = allforms[0].tel.value;
var myReg = /(\d){7,11}/gi;
if(!myReg.test(tel)){
telSpan.innerText = "电话号是7位或者11位";
return false;
}
}

</script>
</head>

<body>
<h1>用户注册</h1>
<form action="#" method = "post">
<table border = "0">
<tr><td class = "td1">用户　名</td><td class = "td2"><input class = "input1" type = "text" name ="userName" value = ""/>
<span id = "userNameSpan" class = "span1"></span></td></tr>
<tr><td>密　　码</td><td><input class = "input1" name = "psw" type = "password" value = ""/>
<span id = "pswSpan" class = "span1"></span></td></tr>
<tr><td>确认密码</td><td><input class = "input1" name = "sureName" type = "password" value = ""/>
<span id = "surePswSpan" class = "span1"></span></td></tr>
<tr><td>年　　龄</td><td><input class = "input1" name = "age" type = "text" value = ""/>
<span id = "ageSpan" class = "span1"></span></td></tr>
<tr><td>电子邮件</td><td><input class = "input1" name = "emailName" type = "text" value = ""/>
<span id = "emailSpan" class = "span1"></span></td></tr>
<tr><td>电话号码</td><td><input class = "input1" name = "tel" type = "text" value = ""/>
<span id = "telSpan" class = "span1"></span></td></tr>
<tr><td><input type = "submit"  onclick = "return check()" value = "注册新用户"/></td><td><input type = "button" value = "重新填写"/></td></tr>
</table>
</form>
</body>
</html>

/*用户名所在列的选择器*/
.td1{
width:80px;
}
/*输入框所在列的选择器*/
.td2{
width:300px;
}
/*注册信息不符合要求的提示信息*/
.span1{
font-size:12px;
color:red;
}

/**/
.input1{
width:150px;
}

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航

注册界面 用javascript检查输入信息格式是否正确 完整版

注册界面用javascript检查输入信息格式是否正确完整版