JS表单验证的代码(常用)
最近没有项目做，有点空余时间，小编把日常比较常用的js表单验证代码整理分享到毛票票平台，供大家学习，需要的朋友参考下吧！
注册验证：
<scriptlanguage="JavaScript"src="js/jquery-1.9.1.min.js"type="text/javascript"></script>
//验证表单
functionvailForm(){
varform=jQuery("#editForm");
if(!vailNickName())return;
if(!vailPhone())return;
if(!vailPwd())return;
if(!vailConfirmPwd())return;
if(!vailEmail())return;
if(!vailCode())return;
if(!vailAgree())return;
form.submit();
}
//验证昵称
functionvailNickName(){
varnickName=jQuery("#nickName").val();
varflag=false;
varmessage="";
varpatrn=/^\d+$/;
varlength=getNickNameLength();
if(nickName==''){
message="昵称不能为空！";
}elseif(length<4||length>16){
message="昵称为4-16个字符！";
}elseif(checkNickNameIsExist()){
message="该昵称已经存在，请重新输入！";
}else{
flag=true;
}
if(!flag){
jQuery("#nickNameDiv").removeClass().addClass("ui-form-itemhas-error");
jQuery("#nickNameP").html("");
jQuery("#nickNameP").html("<iclass=\"icon-errorui-margin-right10\"> <\/i>"+message);
//jQuery("#nickName").focus();
}else{
jQuery("#nickNameDiv").removeClass().addClass("ui-form-itemhas-success");
jQuery("#nickNameP").html("");
jQuery("#nickNameP").html("<iclass=\"icon-successui-margin-right10\"> <\/i>该昵称可用");
}
returnflag;
}
//计算昵称长度
functiongetNickNameLength(){
varnickName=jQuery("#nickName").val();
varlen=0;
for(vari=0;i<nickName.length;i++){
vara=nickName.charAt(i);
//函数格式：stringObj.match(rgExp)stringObj为字符串必选rgExp为正则表达式必选项
//返回值：如果能匹配则返回结果数组，如果不能匹配返回null
if(a.match(/[^\x00-\xff]/ig)!=null){
len+=2;
}else{
len+=1;
}
}
returnlen;
}
//验证昵称是否存在
functioncheckNickNameIsExist(){
varnickName=jQuery("#nickName").val();
varflag=false;
jQuery.ajax(
{url:"checkNickName?t="+(newDate()).getTime(),
data:{nickName:nickName},
dataType:"json",
type:"GET",
async:false,
success:function(data){
varstatus=data.status;
if(status=="1"){
flag=true;
}
}
});
returnflag;
}
//验证手机号
functionvailPhone(){
varphone=jQuery("#phone").val();
varflag=false;
varmessage="";
//varmyreg=/^(((13[0-9]{1})|159|153)+\d{8})$/;
varmyreg=/^(((13[0-9]{1})|(14[0-9]{1})|(17[0-9]{1})|(15[0-3]{1})|(15[5-9]{1})|(18[0-3]{1})|(18[5-9]{1}))+\d{8})$/;
if(phone==''){
message="手机号码不能为空！";
}elseif(phone.length!=11){
message="请输入有效的手机号码！";
}elseif(!myreg.test(phone)){
message="请输入有效的手机号码！";
}elseif(checkPhoneIsExist()){
message="该手机号码已经被绑定！";
}else{
flag=true;
}
if(!flag){
jQuery("#phoneDiv").removeClass().addClass("ui-form-itemhas-error");
jQuery("#phoneP").html("");
jQuery("#phoneP").html("<iclass=\"icon-errorui-margin-right10\"> <\/i>"+message);
//jQuery("#phone").focus();
}else{
jQuery("#phoneDiv").removeClass().addClass("ui-form-itemhas-success");
jQuery("#phoneP").html("");
jQuery("#phoneP").html("<iclass=\"icon-successui-margin-right10\"> <\/i>该手机号码可用");
}
returnflag;
}
//验证手机号是否存在
functioncheckPhoneIsExist(){
varphone=jQuery("#phone").val();
varflag=true;
jQuery.ajax(
{url:"checkPhone?t="+(newDate()).getTime(),
data:{phone:phone},
dataType:"json",
type:"GET",
async:false,
success:function(data){
varstatus=data.status;
if(status=="0"){
flag=false;
}
}
});
returnflag;
}
//验证密码
functionvailPwd(){
varpassword=jQuery("#password").val();
varflag=false;
varmessage="";
varpatrn=/^\d+$/;
if(password==''){
message="密码不能为空！";
}elseif(password.length<6||password.length>16){
message="密码6-16位！";
}elseif(patrn.test(password)){
message="密码不能全是数字！";
}else{
flag=true;
}
if(!flag){
jQuery("#passwordDiv").removeClass().addClass("ui-form-itemhas-error");
jQuery("#passwordP").html("");
jQuery("#passwordP").html("<iclass=\"icon-errorui-margin-right10\"> <\/i>"+message);
//jQuery("#password").focus();
}else{
jQuery("#passwordDiv").removeClass().addClass("ui-form-itemhas-success");
jQuery("#passwordP").html("");
jQuery("#passwordP").html("<iclass=\"icon-successui-margin-right10\"> <\/i>该密码可用");
}
returnflag;
}
//验证确认密码
functionvailConfirmPwd(){
varconfirmPassword=jQuery("#confirm_password").val();
varpatrn=/^\d+$/;
varpassword=jQuery("#password").val();
varflag=false;
varmessage="";
if(confirmPassword==''){
message="请输入确认密码！";
}elseif(confirmPassword!=password){
message="二次密码输入不一致，请重新输入！";
}elseif(patrn.test(password)){
message="密码不能全是数字！";
}else{
flag=true;
}
if(!flag){
jQuery("#confirmPasswordDiv").removeClass().addClass("ui-form-itemhas-error");
jQuery("#confirmPasswordP").html("");
jQuery("#confirmPasswordP").html("<iclass=\"icon-errorui-margin-right10\"> <\/i>"+message);
//jQuery("#confirm_password").focus();
}else{
jQuery("#confirmPasswordDiv").removeClass().addClass("ui-form-itemhas-success");
jQuery("#confirmPasswordP").html("");
jQuery("#confirmPasswordP").html("<iclass=\"icon-successui-margin-right10\"> <\/i>密码正确");
}
returnflag;
}
//验证邮箱
functionvailEmail(){
varemail=jQuery("#email").val();
varflag=false;
varmessage="";
varmyreg=/^([\.a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-])+/;
if(email==''){
message="邮箱不能为空！";
}elseif(!myreg.test(email)){
message="请输入有效的邮箱地址！";
}elseif(checkEmailIsExist()){
message="该邮箱地址已经被注册！";
}else{
flag=true;
}
if(!flag){
jQuery("#emailDiv").removeClass().addClass("ui-form-itemhas-error");
jQuery("#emailP").html("");
jQuery("#emailP").html("<iclass=\"icon-errorui-margin-right10\"> <\/i>"+message);
//jQuery("#email").focus();
}else{
jQuery("#emailDiv").removeClass().addClass("ui-form-itemhas-success");
jQuery("#emailP").html("");
jQuery("#emailP").html("<iclass=\"icon-successui-margin-right10\"> <\/i>该邮箱可用");
}
returnflag;
}
//验证邮箱是否存在
functioncheckEmailIsExist(){
varemail=jQuery("#email").val();
varflag=false;
jQuery.ajax(
{url:"checkEmail?t="+(newDate()).getTime(),
data:{email:email},
dataType:"json",
type:"GET",
async:false,
success:function(data){
varstatus=data.status;
if(status=="1"){
flag=true;
}
}
});
returnflag;
}
//验证验证码
functionvailCode(){
varrandCode=jQuery("#randCode").val();
varflag=false;
varmessage="";
if(randCode==''){
message="请输入验证码！";
}elseif(!checkCode()){
message="验证码不正确！";
}else{
flag=true;
}
if(!flag){
jQuery("#randCodeDiv").removeClass().addClass("ui-form-itemhas-error");
jQuery("#randCodeP").html("");
jQuery("#randCodeP").html("<iclass=\"icon-errorui-margin-right10\"> <\/i>"+message);
//jQuery("#randCode").focus();
}else{
jQuery("#randCodeDiv").removeClass().addClass("ui-form-itemhas-success");
jQuery("#randCodeP").html("");
jQuery("#randCodeP").html("<iclass=\"icon-successui-margin-right10\"> <\/i>");
}
returnflag;
}
//检查随机验证码是否正确
functioncheckCode(){
varrandCode=jQuery("#randCode").val();
varflag=false;
jQuery.ajax(
{url:"checkRandCode?t="+(newDate()).getTime(),
data:{randCode:randCode},
dataType:"json",
type:"GET",
async:false,
success:function(data){
varstatus=data.status;
if(status=="1"){
flag=true;
}
}
});
returnflag;
}
//判断是否选中
functionvailAgree(){
if(jQuery("#agree").is(":checked")){
returntrue;
}else{
alert("请确认是否阅读并同意XX协议");
}
returnfalse;
}
functiondelHtmlTag(str){varstr=str.replace(/<\/?[^>]*>/gim,"");//去掉所有的html标记varresult=str.replace(/(^\s+)|(\s+$)/g,"");//去掉前后空格returnresult.replace(/\s/g,"");//去除文章中间空格}<!DOCTYPEhtml><html><body><h1>我的第一段JavaScript</h1><p>请输入数字。如果输入值不是数字，浏览器会弹出提示框。</p><inputid="demo"type="text"><script>functionmyFunction(){varx=document.getElementById("demo").value;if(x==""){alert("输入不能为空");return;}if(isNaN(x)){alert("请输入数字");return;}if(x.length!=6){alert("请输入6位数字");return;}}</script><buttontype="button"onclick="myFunction()">点击这里</button></body></html>
//验证密码为数字字母下划线
functionCheckPwd(pwd){
varvalidStr="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789_~/!@#$%^&*();-+.=,";
for(i=0;i<pwd.length;i++){
if(validStr.indexOf(pwd.charAt(i))==-1){
returnfalse;
}
}
returntrue;
}
//验证邮箱格式
functioncheckemail(email){
varfilter=/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
if(!filter.test(email)){
returnfalse;
}
returntrue;
}
functionisEmail(val){
return/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_\`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/.test(val);
}
///手机号码验证
functionchecktelephone(cellPhone){
varRegCellPhone=/^([0-9]{11})?$/;
falg=cellPhone.search(RegCellPhone);
if(falg==-1){
returnfalse;
}else{
returntrue;
}
}
//获取URL参数值
functiongetParameter(param){
varquery=window.location.search;
variLen=param.length;
variStart=query.indexOf(param);
if(iStart==-1)
return"";
iStart+=iLen+1;
variEnd=query.indexOf("&",iStart);
if(iEnd==-1)
returnquery.substring(iStart);
returnquery.substring(iStart,iEnd);
}
以上代码是小编给大家介绍的js表单验证，代码简单易懂，非常实用，希望对大家有所帮助，同时也非常感谢大家对毛票票网站的支持！