用javascript写的表单验证

本文介绍了一个使用JavaScript实现的表单验证实例,涵盖用户名、密码、身份证号及邮箱的格式检查。通过正则表达式确保输入的有效性和安全性。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

用javascript写的表单验证,可以用网站的前后台的登陆,大家可以给提点意见。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>验证表单</title>
<script language="JavaScript">
function check(){
var user = document.getElementById("username").value;
var pass = document.getElementById("pass").value;
var rpass = document.getElementById("rpass").value;
var cardnum = document.getElementById("cardnum").value;
var email = document.getElementById("email").value;

//用户名只能由字母、数字、下划线组成,其它字符一律过滤,这样也确保了安全性,
//正则表达式的意思是,当输入0-9、a-z、A-Z、_以外的任何一个或者多个字符时则提示错误
if (user.match("([^a-zA-Z0-9_]+)") != null || user.length < 3 || user.length > 15) {
alert("您输入的用户名应由字母数字下划线组成,长度在3~15位之间!");
return false;
}
else 
if ((pass.length > 20 || pass.length < 6) || (pass == user)) {
alert("您的密码长度过短或者密码与姓名相同,请重新输入!");
return false;
}
else 
if (pass != rpass) {
alert("您两次输入的密码不一致!");
return false;
}
else 
//身份证号用于匹配两种模式,一种是15位的,一种是18位的
//这个正则表达式分三部分:第一位必须为1,最后一位可以是x、X、0-9中的任意一位
//中间一块是指匹配13或者16位数字
if (cardnum.match("1\\d{16}[0-9xX]+|1\\d{13}[0-9xX]+") == null) {
alert("您的身份证号码不正确,请重新输入!");
return false;
}
else 
//正则表达式匹配a-zA-Z0-9_中的一位或者多位,而且必须要有@.这是一个email必须的
if (email.match("[a-zA-Z0-9_]*@.") == null) {
alert("您输入的E-Mail不正确,请重新输入!");
return false;
}
else {
alert("登陆成功!");
}
}
</script>
</head>
<body>
<form action="ff.html" method="get" οnsubmit="return check();">
用户名:<input id="username" type="text" name="username"/><p/>密 码: <input id="pass" type="password" name="password"/><p/>重新输入密码:<input id="rpass" type="password"/><p/>身份证号码:<input id="cardnum" type="text"/><p/>E-Mail:<input id="email" type="text"/>
<br/>
<br/>
<input type="submit" value="提交" /><input type="reset" value="重置"/>
</form>
</body>
</html>

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值