`
IT_hack
  • 浏览: 16384 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js表单失焦验证和提交验证,很便捷的做法!

阅读更多
$(document).ready(function() {


    $("form :input").blur(function() {
		var $parent = $(this).parent();
		$parent.find(".correct2").remove();
		//进行下一步判断前把之前的结果清除
//姓名验证
		if($(this).is("#clientName")) {
			var name_reg = /[^\u4e00-\u9fa5]/;
			if(name_reg.test($("#clientName").val())){
				infohtml($(".name_nifo"),"请输入中文名字",false);
				return false;  
			}else if($("#clientName").val()==""){
				infohtml($(".name_nifo"),"姓名不能为空",false);
				return false; 
			}else{
				infohtml($(".name_nifo"),"",true);
			}
		};
//身份证验证
		if($(this).is("#idNo")) {
			
		   if(checkCardId($("#idNo").val())===false)
		   {
		   		infohtml($(".Identity_card_info"),"您输入身份证有误",false);
		   		return false;    
		   }else if( !is18Ready($("#idNo").val())){
				infohtml($(".Identity_card_info"),"未满18周岁",false);
		   		return false;
			}else{
		   		infohtml($(".Identity_card_info"),"",true);
		   }
		}
//联系地址验证不能空
		if($(this).is("#address")) { 
			
			if($("#address").val()==""){
        	infohtml($(".yy_addres_info"),"联系地址不能为空",false);
			return false;
	        }else if(/^\s+/g.test($("#address").val())){
			infohtml($(".yy_addres_info"),"联系地址不能为空",false);
			return false;
			}else{
	        	infohtml($(".yy_addres_info"),"",true);
	        }
		}
//邮编验证不能空
		if($(this).is("#zipcode")) {
			
			var pattern =/^[0-9]{6}$/;
			if($("#zipcode").val()==""){
        		infohtml($(".Zipcode_info"),"邮编不能为空",false);
				return false;
	        }else if(!pattern.exec($("#zipcode").val())){
	        	infohtml($(".Zipcode_info"),"邮编格式不正确",false);
	        	return false;
	        }else{
	        	infohtml($(".Zipcode_info"),"",true);
	        }
		}
//邮箱验证
		if($(this).is("#eMail")) {
			var reg = /^(\w-*\.*)+@(\w-?)+(\.\w{2,})+$/
	        if (reg.test($("#eMail").val())) {
	        	infohtml($(".yy_Email_info"),"",true);
	        }else if($("#eMail").val()==""){
	        	infohtml($(".yy_Email_info"),"邮箱不能为空",false);
	        	return false;
	        }else {
	        	infohtml($(".yy_Email_info"),"您输入的邮箱地址不正确",false);
	        	return false;
	        }
		}
//交易密码验证
		if($(this).is("#password")) {
			var score = 0;
			$("#password").keydown(function(event){
				if(parseInt(event.keyCode)==32){
	                return false;
			    }
		        $this = $(this).val();
		        $('.yy_possul li:even:gt(0)').removeClass().addClass('yy_possul_li1');
		        if ( /[a-z]+/.test($this) ) score++;
		        if (/\d+/.test($this))  score++;
		        if (/["[`~%!@#^=''?~!@#¥……&——‘”“'?*()(),,。.、]/.test($this)) score++;
		        $('.yy_possul li:even:lt('+score+')').removeClass().addClass('yy_possul_li1 Brown');
		        score = 0;  
			});
			
	
	        if($("#password").val()==""){
	        	infohtml($(".yy_password_info"),"交易密码不能为空",false);
	        	return false;    
	        }else if($("#password").val().length<6){
	        	infohtml($(".yy_password_info"),"请输入6-8个字符",false);
	        	return false;    
	        }else{
	        	infohtml($(".yy_password_info"),"",true);
	        }
		}
//确认密码验证
		if($(this).is("#yy_password2")) {
			if($("#yy_password2").val()===$("#password").val()){
                infohtml($(".yy_password2_info"),"",true);
			}else{
	        	infohtml($(".yy_password2_info"),"两次输入密码不一致,请重新输入",false);
	        	return false;    
	        }
		}
//判断是否勾选协议
		
		
	});
	$("#submit").click(function() {
		var check_b=$(".yy_check_b");
		var check_c=$(".yy_check_c");
		
		
		$("form :input").trigger("blur");
		var errorNum = $("form .warning2").length;
		
		if(errorNum) {
			return false;
		}else if(check_b.attr("checked")===undefined || check_c.attr("checked")===undefined ){
				alert("请阅读《开户协议》与《用户须知》")
				return false;
			
		}
		
	});
});
  function infohtml(elem_t,mg,flog){
  	if(flog){
    	elem_t.removeClass("warning2").addClass(' correct2');
    	elem_t.text(mg);
   	}else{
    	elem_t.removeClass("correct2").addClass(' warning2');
    	elem_t.text(mg);
    }
  }
//是否满18岁
function is18Ready(idCard){
  var birthday;
  if(idCard.length == 15){
    birthday = idCard.substring(6, 12);
  } else if(idCard.length == 18){
    birthday = idCard.substring(6, 14);
	
  }
  var thisYear = birthday.substring(0, 4);
  var thisMonth = parseInt(birthday.substring(4, 6), 10) - 1;
  var thisDate = birthday.substring(6);
  var birthdayDate = new Date(thisYear, thisMonth, thisDate);
  var now = new Date();
  
  if(now.getTime() - birthdayDate.getTime() >= 1000*60*60*24*365*18){
	 return true;
	}else{return false;};
  
}	
	
function checkCardId(socialNo){

	  if(socialNo == "")
	  {
	   
	    return (false);
	  }

	  if (socialNo.length != 15 && socialNo.length != 18)
	  {
	    
	    return (false);
	  }
		
	 var area={11:"北京",12:"天津",13:"河北",14:"山西",15:"内蒙古",21:"辽宁",22:"吉林",23:"黑龙江",31:"上海",32:"江苏",33:"浙江",34:"安徽",35:"福建",36:"江西",37:"山东",41:"河南",42:"湖北",43:"湖南",44:"广东",45:"广西",46:"海南",50:"重庆",51:"四川",52:"贵州",53:"云南",54:"西藏",61:"陕西",62:"甘肃",63:"青海",64:"宁夏",65:"新疆",71:"台湾",81:"香港",82:"澳门",91:"国外"}; 
	   
	   if(area[parseInt(socialNo.substr(0,2))]==null) {
	   	
	    	return (false);
	   } 
	    	
	  if (socialNo.length == 15)
	  {
	     pattern= /^\d{15}$/;
	     if (pattern.exec(socialNo)==null){
			
			return (false);
	    }
		var birth = parseInt("19" + socialNo.substr(6,2));
		var month = socialNo.substr(8,2);
		var day = parseInt(socialNo.substr(10,2));
		switch(month) {
			case '01':
			case '03':
			case '05':
			case '07':
			case '08':
			case '10':
			case '12':
				if(day>31) {
					
					return false;
				}
				break;
			case '04':
			case '06':
			case '09':
			case '11':
				if(day>30) {
					
					return false;
				}
				break;
			case '02':
				if((birth % 4 == 0 && birth % 100 != 0) || birth % 400 == 0) {
					if(day>29) {
						
						return false;
					}
				} else {
					if(day>28) {
						
						return false;
					}
				}
				break;
			default:
				
				return false;
		}
		var nowYear = new Date().getYear();
		if(nowYear - parseInt(birth)<15 || nowYear - parseInt(birth)>100) {
			
			return false;
		}
	    return (true);
	  }
	  
	  var Wi = new Array(
	            7,9,10,5,8,4,2,1,6,
	            3,7,9,10,5,8,4,2,1
	            );
	  var   lSum        = 0;
	  var   nNum        = 0;
	  var   nCheckSum   = 0;
	  
	    for (i = 0; i < 17; ++i)
	    {
	        

	        if ( socialNo.charAt(i) < '0' || socialNo.charAt(i) > '9' )
	        {
	           
	            return (false);
	        }
	        else
	        {
	            nNum = socialNo.charAt(i) - '0';
	        }
	         lSum += nNum * Wi[i];
	    }

	  
	    if( socialNo.charAt(17) == 'X' || socialNo.charAt(17) == 'x')
	    {
	        lSum += 10*Wi[17];
	    }
	    else if ( socialNo.charAt(17) < '0' || socialNo.charAt(17) > '9' )
	    {
	        
	        return (false);
	    }
	    else
	    {
	        lSum += ( socialNo.charAt(17) - '0' ) * Wi[17];
	    }

	    
	    
	    if ( (lSum % 11) == 1 )
	    {	
	        return true;
	    }
	    else
	    {
	        
	        return (false);
	    }
		
}

  欢迎访问小站:www.it-fans.com

分享到:
评论

相关推荐

    Js 表单提交验证函数(很全了)

    本篇将详细介绍JavaScript表单验证函数的一些关键知识点。 一、基本验证概念 1. 验证类型:表单验证通常包括对字符串长度、数字范围、邮箱格式、电话号码、日期等的验证。 2. 验证时机:验证可以在用户输入时实时...

    表单验证js 提交前验证

    本压缩包包含了一个名为"validateForm.js"的JavaScript文件以及一份"表单验证说明.txt"的文本文件,它们专门用于实现前端的表单验证功能。 `validateForm.js` 是一个JavaScript函数库,它提供了对HTML表单字段的...

    javascript很好很强大的JS表单验证

    javascript很好很强大的JS表单验证 javascript很好很强大的JS表单验证

    利用JS文件来优化网站表单验证和提交代码

    为了提升开发效率和代码质量,本文提出了通过JavaScript(JS)文件来优化网站表单验证和提交代码的方案。以下是根据给定文件内容生成的详细知识点。 知识点一:JavaScript的表单验证和提交优化 JavaScript是一种...

    JavaScript表单即时验证 验证不成功不能提交

    不能再让表单在提交按钮之后才被验证了!你输入的任何信息表单都会即时反应! 这个JavaScript的关键是onChange()事件,使用onKeyUp()事件完成是不行的,人家没有输入完毕,你就说人家不对,多不友好啊╮(╯▽╰)╭ ...

    js提交表单及js表单验证

    ### JS提交表单及JS表单验证 在Web开发中,JavaScript经常被用来增强用户体验,其中一个重要的应用领域就是表单验证。通过JavaScript进行前端验证,可以及时反馈用户输入错误,提高交互效率。本文将详细解释如何...

    js验证表单大全,用JS控制表单提交 ,javascript提交表单

    js验证表单大全,用JS控制表单提交 ,javascript提交表单

    js提交表单及js表单验证大全

    根据提供的文件信息,我们可以总结出一系列...通过以上分析可以看出,JavaScript在处理表单验证方面非常灵活且强大,能够满足各种复杂的验证需求。开发者可以根据实际应用的需求选择合适的方法来增强用户体验和安全性。

    js表单验证 全网最全的 表单验证

    总结来说,这个资源集合提供了一系列关于JavaScript表单验证的方法和实例,包括基础的输入验证、电子邮件和URL验证,以及登录验证的实践。无论你是初学者还是经验丰富的开发者,都可以从中获取有价值的参考和灵感,...

    一个完美的js表单验证案例

    "一个完美的js表单验证案例"利用JavaScript(特别是jQuery库)实现了这一功能,提供了高效、用户友好的验证机制。 JavaScript作为客户端脚本语言,可以直接在用户的浏览器上运行,这使得表单验证可以实时进行,减少...

    js表单验证大全,js提交表单

    2. **JavaScript表单验证** - **内置函数验证**: `isNaN()`用于检测是否为数字,`required`属性可直接在HTML5中设置必填项。 - **自定义函数验证**: 可以编写自定义函数,如`validateEmail()`,对特定输入进行校验...

    JS表单验证与JS常见问题解决方案

    "JavaScript常见问题整理.txt"、"表单验证大全.txt"、"JavaScript表单验证控制代码大全.txt"、"JavaScript验证表单函数大全.txt"这些文件将提供更具体的信息和示例代码,帮助深入理解和掌握这一主题。

    javascript表单验证方式一

    本文将深入探讨"javascript表单验证方式一",介绍如何利用JavaScript进行表单验证,确保用户输入的数据符合预设规则,提高用户体验,同时也减轻了服务器端的压力。 首先,表单验证的基本目标是检查用户在HTML表单中...

    原生js实现表单验证(提交后验证)

    在网页开发中,表单验证是一项至关重要的任务,它确保用户输入的数据符合预期的格式和规则,从而提高用户体验并防止无效或恶意数据的提交。原生JavaScript实现的表单验证可以避免对第三方库的依赖,使得代码更加轻量...

    js表单验证、js导出excel、js验证

    JS表单验证是在用户提交数据之前,于客户端执行的一系列检查,以确保输入的数据符合预设的规则,如非空、格式正确等。这可以减少无效请求,提高服务器效率,并为用户提供即时反馈。 1. 验证基本类型:JS提供了多种...

    简单的表单验证

    JavaScript表单验证的核心在于事件监听和验证函数。常见的表单事件有`submit`(提交)、`change`(改变)、`focus`(获取焦点)和`blur`(失去焦点)。开发者通常会在`submit`事件上添加验证逻辑,以在用户尝试提交...

    js实时动态验证表单是否合法

    JavaScript(简称JS)是网页开发中用于实现客户端交互和数据验证的重要工具。在网页表单设计中,实时动态验证能够极大地提升用户体验,因为它允许用户在输入时立即得到反馈,了解其填写的信息是否符合要求,无需等待...

    javascript表单验证 正则表达式验证表单

    比较实用的javascript做的表单验证,验证的表单域包括用户名、密码、密码...表单域基本通过获得焦点显示提示信息,失去焦点进行验证,还有提交表单验证。提交表单先进行必填项不能为空验证,再进行正则表达式匹配验证。

    js表单验证实例,HTML文件,javascript常用表单验证

    js表单验证实例,HTML文件,javascript常用表单验证: 账号、密码、身份证等

Global site tag (gtag.js) - Google Analytics