`

(正则表达式)表单验证

 
阅读更多


//获取DOM对象
function e(str){
    return document.getElementById(str);
}

//动态添加有样式的内容
//ok_prompt 为提示文字验证正确的className
//error_prompt  为提示文字验证错误时className
//import_prompt  为提示文字提示时className

function appendHtml(obj,str,className){
    obj.innerHTML = str;
    obj.className = className;
}
//验证表单
function checkForm(){
//方法1:	
/*if(checkUserName()&checkPwd()&checkRepwd()&checkNickName()&checkTel()&checkEmail()){
		return true;	
	}else{
		return false;
	}*/
//方法2:
	 var ids  = ["checkUserName()","checkPwd()","checkRepwd()","checkNickName()","checkTel()","checkEmail()"];
    var sum = 0;
    for(var i = 0; i<ids.length ;i++){
        if ( eval(ids[i]) ){
			sum++;
		}
    }
    return ids.length == sum ? true : false;
	
}
//获得鼠标时触发的事件
//import_prompt  为提示文字提示时className

function focusShow(inputId,msg){
	appendHtml(e(inputId+"Id"),msg,"import_prompt");

}
//验证用户名输入1、由字母、数字、下划线、点、减号组成<br/>2、只能以数字、字母开头或结尾,且长度为4-18
function checkUserName(){
	var userName = e("userName");
	var reg=/^[a-zA-Z0-9][a-zA-Z0-9\-\._]{2,16}[a-zA-Z0-9]$/;
	if(userName.value==""){
		appendHtml(e("userNameId"),"用户名不能为空!","error_prompt");
		
		//在文本域中设置焦点
		userName.focus();
		
		return false;
		
	}else if(userName.value.match(reg)==null){
		appendHtml(e("userNameId"),"请输入正确的通行证用户名!","error_prompt");
		
		//选取文本域中的内容:
		userName.select();
		
		return false;
		
	}else{
		appendHtml(e("userNameId"),"输入正确!","ok_prompt");
		return true;
	}  
}

//验证密码
function checkPwd(){
   var pwd= e("pwd");
	if(pwd.value==""){
		appendHtml(e("pwdId"),"登录密码不能为空!","error_prompt");
		return false;
	}else if(pwd.value.length<6||pwd.value.length>16){
		appendHtml(e("pwdId"),"密码长度必须为6到16字符!","error_prompt");
		return false;
	}else{
		appendHtml(e("pwdId"),"输入正确!","ok_prompt");
		return true;
	}   
}
//验证重复密码
function checkRepwd(){
	var pwd=e("pwd");
	var repwd=e("repwd");
	var repwdId=e("repwdId");
	if(repwd.value!==pwd.value){
		appendHtml(repwdId,"两次输入的密码不一致!","error_prompt");
		return false
	}else if(repwd.value==""){
		appendHtml(repwdId,"确认密码不能为空!","error_prompt");
		return false;
	}else{
		return true;
	}
}

//验证昵称
function checkNickName(){
	var nickName=e("nickName");	
	var nickNameId=e("nickNameId");
	var reg=/^([\u4e00-\u9fa5]|\w|[!@#$%*])+$/;
	var len=nickName.value.replace(/[\u4e00-\u9fa5]/g,"ab").length;
	if(nickName.value==""){
		appendHtml(nickNameId,"昵称不能为空!","error_prompt");	
		return false;
	}else if(nickName.value.match(reg)==null){
	//如果js中match函数方法没有找到匹配,返回 null。如果找到匹配返回一个数组并且更新全局 RegExp 对象的属性以反映匹配结果。
		appendHtml(nickNameId,"只能由汉字、字母、数字、下划线以及@!#$%&*特殊字符组成!","error_prompt");	
		return false;
	}else if(len<4||len>16){
		appendHtml(nickNameId,"昵称为4-16个字符","error_prompt");
		return false;
	}else{
		appendHtml(nickNameId,"输入正确!","ok_prompt");
		return true;
	}
	
}

//验证手机
function checkTel(){
	var odom=e("tel");
	var omsg=e("telId");
	var reg=/^(13|15|18)\d{9}$/;
	if(odom.value==""){
		appendHtml(omsg,"关联手机号不能为空!","error_prompt");	
		return false;
	}else if(odom.value.match(reg)==null){
		appendHtml(omsg,"关联手机号码输入不正确,请重新输入!","error_prompt");	
		return false;
	}else{
		appendHtml(omsg,"输入正确","ok_prompt");	
		return true;
	}
}
//验证邮箱
function checkEmail(){
     var odom=e("email");
	 var omsg=e("emailId");
	 var reg=/^\w+@\w+(\.[a-zA-Z]{2,3}){1,2}$/
	 if(odom.value==""){
		appendHtml(omsg,"保密邮箱不能为空!","error_prompt");	
		return false;
	}else if(odom.value.match(reg)==null){
		appendHtml(omsg,"保密邮箱格式不正确,请重新输入!","error_prompt");	
		return false;
	}else{
		appendHtml(omsg,"输入正确","ok_prompt");	
		return true;
	}
}

 
 

  • 大小: 24.8 KB
分享到:
评论

相关推荐

    js正则表达式表单验证小案例

    js正则表达式表单验证小案例

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

    ### JavaScript正则表达式在表单验证中的应用详解 在Web开发中,表单验证是确保数据质量和用户体验的重要环节。JavaScript正则表达式提供了一种强大的工具,用于前端数据校验,确保用户输入的数据格式正确无误。...

    js正则表达式表单验证代码.zip

    本资源"js正则表达式表单验证代码.zip"提供了一套基于JavaScript的正则表达式实现的表单验证解决方案,涉及到CSS、HTML5、jQuery等相关技术。 JavaScript正则表达式是一种强大的文本处理工具,常用于验证用户输入,...

    javascript正则表达式表单验证

    ### JavaScript正则表达式表单验证知识点解析 在Web开发中,前端表单验证是非常重要的一个环节,它能够有效提高用户体验并确保数据的有效性。JavaScript中的正则表达式是实现这一功能的重要工具之一。本文将根据...

    使用正则表达式验证一年的12个月份

    正则表达式是一种强大的文本处理工具,用于匹配、查找、替换等操作,广泛应用于编程语言中。在IT行业中,正则表达式...无论是在网页表单验证、服务器端数据处理还是数据分析场景,正则表达式都是一个强大而灵活的工具。

    常用正则表达式表单验证代码

    ### 正则表达式表单验证 #### 1. **验证数字序列** - **验证纯数字**:`^[0-9]*$` - 该表达式用于验证输入是否全为数字,且允许为空。 - **验证固定长度的数字**:`^\d{n}$` - 其中`\d`代表任何数字,`{n}`表示...

    C#表单正则表达式验证手册

    《C#表单正则表达式验证手册》是一份详细阐述如何在C#环境中利用正则表达式进行表单验证的实用指南。手册的核心在于提供更灵活、更强大的验证方式,超越了Visual Studio (VS)内置控件的功能限制。通过学习这份手册,...

    正则表达式转换工具

    - 数据验证:在表单提交时,可以使用正则表达式验证输入格式,如邮箱、电话号码等。 - 文件搜索:在代码编辑器中,使用正则表达式快速查找和替换特定模式的文本。 - 数据清洗:在数据预处理阶段,正则表达式可以...

    jq非空验证,js正则表达式验证邮箱和手机号码

    在本案例中,我们关注的是使用jQuery(jq)进行非空验证,以及使用JavaScript(js)的正则表达式来验证邮箱和手机号码的正确性。以下是关于这些知识点的详细说明: 1. **jQuery(jq)非空验证**: jQuery是一种轻...

    javascript&正则表达式进行表单验证

    本主题将深入探讨如何利用JavaScript和正则表达式进行有效的表单验证,以实现无刷新验证,提高用户体验。 首先,JavaScript是一种广泛应用于客户端的脚本语言,它可以直接在用户的浏览器上运行,处理用户与网页的...

    正则表达式(Deelx版)|正则表达式(Deelx版)支持库

    - **数据验证**:在表单提交时,验证输入是否符合指定格式,如邮箱地址或电话号码。 - **文本替换**:批量替换符合模式的文本,如统一格式化日期。 - **分词**:在自然语言处理中,正则表达式用于识别和提取特定...

    表单验证的正则表达式

    表单验证的正则表达式html与js表单验证的正则表达式html与js表单验证的正则表达式html与js

    正则表达式大全 - 收集的最常用正则表达式

    在使用正则表达式时,尤其是在Web开发中进行表单验证时,这些表达式可以帮助我们确保用户输入的数据符合预期的格式。例如,`^[A-Za-z]+$` 可以验证只包含英文字符的字符串,而`^[1-9]d*|0$`则用于确认输入的为非负...

    正则表达式 表单验证 网页编程

    正则表达式(Regular Expression,简称regex)是用于匹配字符串的一种模式,广泛应用于网页编程中,尤其是表单验证环节。它是编程语言中的一个重要工具,帮助开发者确保用户输入的数据符合特定格式,从而保证数据的...

    JS的正则表达式进行验证

    通过合理的正则表达式设计,可以实现对用户输入的即时反馈,例如,在用户填写表单时,实时显示错误提示,告知用户输入格式不正确,或是在提交前进行集中检查,确保所有必填项均满足格式要求。 ### 知识点详解: ##...

Global site tag (gtag.js) - Google Analytics