JS表单验证-12个常用的JS表单验证
最近有个项目用到了表单验证，小编在项目完结后的这段时间把常用的JS表单验证demo整理了一下，和大家一起分享~~~
1. 长度限制
<p>1. 长度限制</p>
<form name=a onsubmit="return test()">
<textarea name="b" cols="40" rows="6" placeholder="不能超过50个字符！"></textarea><br />
<input type="submit" name="Submit" value="check">
</form>
<script language="javascript">
function test() {
if(document.a.b.value.length>50){
alert("不能超过50个字符！");
document.a.b.focus();
return false;
}
}
</script>2. 只能是汉字
<p>2. 只能是汉字 </p>
<input type="text" onblur="isChinese(this.value)" placeholder="请输入中文！" />
<script language="javascript">
function isChinese(obj){
var reg=/^[\u0391-\uFFE5]+$/;
if(obj!=""&&!reg.test(obj)){
alert('必须输入中文！');
return false;
}
}
</script>以下demo中的HTML的结构与验证中文结构相似的，小编就只写js啦~~~
3. 只能是英文字母
<script type="text/javascript">
//验证只能是字母
function checkZm(zm){
var zmReg=/^[a-zA-Z]*$/;
if(zm!=""&&!zmReg.test(zm)){
alert("只能是英文字母！");
return false;
}
}
</script>4. 只能是数字
<script language=javascript>
//验证只能为数字
function checkNumber(obj){
var reg = /^[0-9]+$/;
if(obj!=""&&!reg.test(obj)){
alert('只能输入数字！');
return false;
}
}
</script>5. 只能是英文字母和数字
<script type="text/javascript">//验证只能是字母和数字
function checkZmOrNum(zmnum){
var zmnumReg=/^[0-9a-zA-Z]*$/;
if(zmnum!=""&&!zmnumReg.test(zmnum)){
alert("只能输入是字母或者数字,请重新输入");
return false;
}
}
</script>6. 检验时间大小(与当前时间比较)
<script type="text/javascript">//检验时间大小(与当前时间比较)
function checkDate(obj){
var obj_value=obj.replace(/-/g,"/");
//替换字符，变成标准格式(检验格式为：'2009-12-10')
// var obj_value=obj.replace("-","/");
//替换字符，变成标准格式(检验格式为：'2010-12-10 11:12')
var date1=new Date(Date.parse(obj_value));
var date2=new Date();//取今天的日期
if(date1>date2){
alert("不能大于当前时间！");
return false;
}
}
</script>7. 屏蔽关键字(这里屏蔽***和****)
<script type="text/javascript">
function test(obj) {
if((obj.indexOf ("***") == 0)||(obj.indexOf ("****") == 0)){
alert("屏蔽关键字(这里屏蔽***和****)！");
return false;
}
}
</script>8. 两次输入密码是否相同
<script type="text/javascript">
function check(){
with(document.all){
if(input1.value!=input2.value) {
alert("密码不一致")
input1.value = "";
input2.value = "";
}
else {
alert("密码一致");
document.forms[0].submit();
}
}
}
</script>9. 表单项不能为空
<script language="javascript">
function CheckForm(obj) {
if (obj.length == 0) {
alert("姓名不能为空!");
return false;
}
return true;
alert("姓名不能为空!");
}
</script>10. 邮箱验证
<script language="javascript">
function test(obj){//对电子邮件的验证
var myreg = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
if(!myreg.test(obj)){
alert('请输入有效的邮箱！');
return false;
}
}
</script>11. 验证手机号
<script type="text/javascript">
function validatemobile(mobile) {
if(mobile.length==0) {
alert('手机号码不能为空！');
return false;
}
if(mobile.length!=11){
alert('请输入有效的手机号码，需是11位！');
return false;
}
var myreg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+\d{8})$/;
if(!myreg.test(mobile)){
alert('请输入有效的手机号码！');
return false;
}
}
</script>12. 验证身份证号码（需是有效身份证）
<script type="text/javascript">// 构造函数，变量为15位或者18位的身份证号码
function clsIDCard(CardNo) {
this.Valid=false;this.ID15='';
this.ID18='';
this.Local='';
if(CardNo!=null)this.SetCardNo(CardNo);
}
// 设置身份证号码，15位或者18位
clsIDCard.prototype.SetCardNo = function(CardNo) {
this.ID15='';
this.ID18='';
this.Local='';
CardNo=CardNo.replace(" ","");
var strCardNo;
if(CardNo.length==18) {
pattern= /^\d{17}(\d|x|X)$/;
if (pattern.exec(CardNo)==null)return;
strCardNo=CardNo.toUpperCase();
}
else {
pattern= /^\d{15}$/;
if (pattern.exec(CardNo)==null)return;
strCardNo=CardNo.substr(0,6)+'19'+CardNo.substr(6,9)strCardNo+=this.GetVCode(strCardNo);
}this.Valid=this.CheckValid(strCardNo);
}
// 校验身份证有效性
