表单的验证js以及事件的注册代码详解教程
js实现表单及时验证功能用户信息立即验证
js实现表单及时验证功能⽤户信息⽴即验证问题:表单怎么在输⼊后⽴即验证,⽽不是提交后再验证那么不⽅便(⽹上搜到的要么是模棱两可,要么是残缺不全…)⽅法:鉴于此,⼩可,⽔⼭奇,将其代码补全,加上⼩可我个⼈的理解(注释)在上⾯,仅供后来者少⾛弯路,也请各路好汉批评指正…(转发请注作者,xiexie)————table表格版,以后会继续有JQuery版…如果帮助到您,顶⼀下ヾ(≧O≦)〃嗷~截图:代码:<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>⽤户注册</title><!-- 此处引⽤外部css样式 --><link rel="stylesheet" href="css/style.css" /><script type="text/javascript">//及时验证⽤户名function checkuse(){//在每个函数中定义check变量是为了在表单提交后,能够逐个验证每个函数是否通过,很好很好。
(以下同理)var check;var username = document.getElementById("username").value;if (username.length > 18 || username.length < 6) {alert("⽤户名输⼊不合法,请重新输⼊!");//此处甚妙,既然你在此处输⼊错误,那么按理说当然要在此处继续输⼊了。
(在此处继续获取焦点!)document.getElementById("username").focus();check = false;} else {document.getElementById("checktext1").innerHTML = "* ⽤户名由6-18位字符组成 √";check = true;}return check;}//利⽤正则表达式判断密码符合否function checkpwd() {var check;var reg = /[^A-Za-z0-9_]+/;var regs = /^[a-zA-Z0-9_\u4e00-\u9fa5] + $ /;var password = document.getElementById("password").value;if (password.length < 6 || password.length > 18 || regs.test(password)) {alert("密码输⼊不合法,请重新输⼊!");document.getElementById("password").focus();check = false;} else {document.getElementById("checktext2").innerHTML = "* 密码由6-18位字符组成,且必须包含字母、数字和标点符号 √";check = true;}return check;}//验证密码是否不⼀致!function checkpwdc() {var check;var password = document.getElementById("password").value;var pwdc = document.getElementById("pwdc").value;if (password != pwdc) {alert("两次输⼊密码不⼀致,请重新输⼊!");document.getElementById("pwdc").focus();check = false;} else {document.getElementById("checktext3").innerHTML = "* 请再次输⼊你的密码 √";check = true;}return check;}//提交时验证⽤户类别function checkut(){var check;if(document.getElementById("selUser").selectedIndex == 0)alert("请选择⽤户类型!");document.getElementById("selUser").focus();check = false;}else{document.getElementById("checktext4").innerHTML = "* 请选择⽤户类型 √";check = true;}return check;}//提交时验证⽤户性别function checkGender(){var check;var gender = "";//获取所有名称为sex的标签var sex = document.getElementsByName("sex");//遍历这些名称为sex的标签for(var i=0;i<sex.length;++i){//如果某个sex被选中,则记录if(sex[i].checked)gender = sex[i].value;}if(gender == ""){alert("请选择性别!");check = false;}else{document.getElementById("checktext5").innerHTML = "* 请选择你的性别 √";check = true;}return check;}//及时验证出⽣⽇期function checkDate(){var check;if(document.getElementById("txtDate").value ==""){alert("请填写出⽣⽇期!");document.getElementById("txtDate").focus();check = false;}else{document.getElementById("checktext6").innerHTML = "* 请选择你的出⽣⽇期 √"; check = true;}return check;}//及时验证兴趣爱好function checkHobby(){var check;var hobby = 0;//objNum为所有名称为hobby的input标签var objNum = document.getElementsByName("hobby");//遍历所有hobby标签for(var i=0;i<objNum.length;++i){//判断某个hobby标签是否被选中if(objNum[i].checked==true)hobby++;}//如果有选中的hobby标签if(hobby >=1){document.getElementById("checktext7").innerHTML = "* 请选择你的兴趣爱好 √"; check = true;}else{alert("请填写爱好!");check = false;}return check;}//正则表达式验证电⼦邮件(及时)function checkemail(){var check;//电⼦邮件的正则表达式var e1 = document.getElementById("email").value.indexOf("@",0);var e2 = document.getElementById("email").value.indexOf(".",0);if(email == "" || (e1==-1 || e2==-1) || e2<e1 )alert("E_mail输⼊错误!");document.getElementById("email").focus();check = false;} else {document.getElementById("checktext8").innerHTML = "* 请填写常⽤的EMAIL,将⽤于密码找回 √";check = true;}return check;}//及时验证⾃我介绍function checkintro(){var check;var intro = document.getElementById("introduction").value;if (intro.length > 100) {alert("字数超限!");check = false;} else {document.getElementById("checktext9").innerHTML = "* 限100字内 √";document.getElementById("checktext9").focus();check = true;}return check;}//提交表单时所有都验证⼀遍(若任何⼀个验证不通过,则返回为false,阻⽌表单提交)function check() {var check = checkuse() && checkpwd() && checkpwdc() && checkut() && checkGender() && checkDate() && checkHobby() && checkemail() &&checkintro();return check;}</script></head><body ><!-- <form action ="跳转页⾯" method ="get"|"post" name ="表单名称" target ="打开⽅式" enctype="multipart/form-data" > --> <!-- onsubmit()函数在返回值为true时提交表单。
Javascript的表单验证
JavaScript 可用来在数据被送往服务器前对HTML 表单中的这些输入数据进行验证。
坏数据不该抵达服务器:提交表单时的验证.表单域对象里有个form特性,它使用数组表示了整份表单的域.假如这里只有一个简单的信息文本框和一个邮政编码框,还有一个提交按钮.<form><input id="message" name="message" type="text" size="12" onBlur="validate_Length(1,32,this,document.getElementById('message_help'));" /><message_help" class="help"></span><input id="ZipCode" name="phone" type="text" size="5" onBlur="validate_ZipCode(this,document.getElementById('ZipCode_help'));" /><span id="ZipCode_help" class="help"></span><input type="button" value="Order Banner" onClick="placeOrder(this.form);"/></form><script language="javascript" type="text/javascript">//文本长度验证function validate_Length(minLegth,maxlength,inputFiled,helpText){if(inputFiled.value.length<minLegth||inputFiled.value.length>maxlength){if(helpText!=null){helpText.innerHTML="请输入长度为"+minLenght+"到"+maxLength+"的文本";return false;}}else if(helpText!=null){helpText.innerHTML=""return true;}}//邮政编码验证function validate_ZipCode(inputFiled,helpText){if(inputFiled.value.length!=5){if(helpText!=null)helpText.innerHTML="邮政编码长度必须为5位";return false;}else if(isNaN(inputFiled.value)){if(helpText!=null)helpText.innerHTML="邮政编码必须为数字";return false;}else if(helpText!=null){helpText.innerHTML=""return true;}}function placeOrder(form){if(validateNonEmpty(1,32,form["phone"],form["phone_help"])&&validate_ZipCode(fo rm["ZipCode"],form["ZipCode_help"])){form.submit();}else{alert("您填写的表单数据至少有一项不合法");}}</script>总结:只需要调用相应的验证函数,得到返回值,便可在最后提交表单的时候完成最后的数据过滤 在实际应用中,往往需要对数据的长度,非空,非法字符,格式,大小定等等做验证,这里不一一介绍,重在领会。
如何在JavaScript中实现表单的验证和数据校验
如何在JavaScript中实现表单的验证和数据校验表单的验证和数据校验在前端开发中是非常重要的一部分,它可以确保用户输入的数据格式正确,有效地减少后端的数据处理压力,同时也能提高用户体验。
在本文中,我们将探讨如何在JavaScript中实现表单的验证和数据校验,并提供一些实用的技巧和示例代码。
### 1.表单验证的重要性表单是网页中用户输入数据的一个重要部分,用户可以通过表单提交各种类型的数据,比如文本、数字、日期、邮箱等等。
然而,用户输入的数据并不总是符合预期的格式和要求,这时候我们就需要对表单进行验证和数据校验,以确保输入数据的准确性和完整性。
表单验证的重要性主要体现在以下几个方面:-数据准确性:通过对表单的验证和数据校验,可以确保用户输入的数据格式正确,有效的减少后端的数据处理压力。
-用户体验:当用户输入了不符合规范的数据时,通过及时的反馈和提醒,可以有效地提高用户体验。
-安全性:通过对用户输入的数据进行验证和过滤,可以防止恶意输入和攻击,提高系统的安全性。
### 2.表单验证的方法在JavaScript中,我们可以通过几种方法来实现对表单的验证和数据校验:-使用原生JavaScript:通过JavaScript的事件监听和表单元素的属性来实现表单验证和数据校验。
-使用第三方库:如jQuery Validation、VeeValidate等,这些库提供了丰富的表单验证和数据校验功能,并且使用起来较为方便。
-使用HTML5的表单验证:HTML5提供了一些新的表单元素和属性,比如input的type属性、maxlength属性、pattern属性等,可以方便地实现表单的验证。
在本文中,我们将重点介绍使用原生JavaScript来实现表单验证和数据校验的方法。
### 3.表单验证和数据校验的步骤实现表单验证和数据校验的主要步骤分为以下几个部分:-监听表单提交事件:当用户提交表单时,我们需要触发验证和数据校验的逻辑。
javascript程序设计正则表达式应用-实现表单验证实验总结
javascript程序设计正则表达式应用-实现表单验证实验总结JavaScript程序设计正则表达式应用实现表单验证实验总结在Web开发中,表单验证是一个非常重要的环节,它可以帮助我们确保用户输入的数据符合我们的预期和要求。
而JavaScript的正则表达式是一种强大的工具,可以用来对用户输入进行有效的验证和筛选。
本文将基于表单验证的实验,一步一步介绍如何利用JavaScript正则表达式来实现表单验证,并对实验过程进行总结和评估。
第一步:实验目标和准备工作在开始实验之前,我们需要明确实验的目标和准备相关的材料和环境。
实验目标:使用JavaScript正则表达式来实现表单验证,并确保用户输入的数据符合预期和要求。
准备工作:1. 一个Web开发环境,例如Apache服务器和一个支持JavaScript的浏览器。
2. 一个包含HTML表单元素的网页文件,例如一个注册表单。
第二步:了解正则表达式的基本语法和规则在开始实验之前,我们需要对正则表达式的基本语法和规则有一定的了解。
简要介绍一下正则表达式的基本语法和常用规则:1. 字符匹配- 字符:直接匹配字符本身。
- 转义字符:使用'\'来转义特殊字符的匹配。
2. 特殊字符- 点号(.):匹配任意字符。
- 加号(+):匹配一个或多个前面的字符。
- 星号(*):匹配零个或多个前面的字符。
- 问号(?):匹配零个或一个前面的字符。
- 花括号({}):用于指定匹配数量的范围。
3. 字符类和取反- 字符类([...]):匹配方括号中的任意一个字符。
- 取反([^...]):匹配除了方括号中的任意一个字符以外的字符。
4. 边界匹配- 开始边界(^):匹配字符串的开头。
- 结束边界():匹配字符串的结尾。
5. 数量限定- 数字(\d):匹配一个数字字符。
- 非数字(\D):匹配一个非数字字符。
- 字母(\w):匹配一个字母字符。
- 非字母(\W):匹配一个非字母字符。
用JavaScript实现表单验证的方法
用JavaScript实现表单验证的方法JavaScript是一种脚本语言,它可以在网页中运行,与HTML 和CSS结合起来,为用户提供更好的体验。
其中,表单验证是一项重要的任务,它可以确保用户提交的数据是正确和有效的,从而避免出现不必要的错误。
在本文中,我们将介绍如何用JavaScript实现表单验证的方法,让用户提交数据时更加安全和可靠。
一、表单验证的基础知识在开始使用JavaScript进行表单验证之前,我们需要了解一些基础知识。
首先,表单是网页中收集用户数据的一种重要方式,它通常包含一些输入框、下拉菜单、单选按钮等控件,用来收集不同类型的数据。
其次,表单验证是一项必要的任务,它可以确保用户提交的数据是正确和有效的,避免出现数据错误或者安全问题。
最后,JavaScript是一种脚本语言,通过在网页中嵌入JavaScript代码,我们可以实现表单验证等复杂的功能。
二、表单验证的方法1. 验证输入框的数据在表单中,输入框是最常见的一种控件,用户可以在输入框中输入各种数据。
为了确保这些数据是正确和有效的,我们可以使用JavaScript来验证输入框中的数据。
例如,我们可以创建一个JavaScript函数,使用正则表达式来验证输入框中的数据。
以下是一个简单的例子:```function validateInput(input) {var pattern = /^[a-zA-Z0-9_-]{3,16}$/; //定义正则表达式return pattern.test(input); //返回验证结果}```通过调用这个函数,我们可以验证输入框中的数据是否符合正则表达式的要求。
如果验证通过,函数返回true,否则返回false。
2. 验证下拉菜单的选项在表单中,下拉菜单是另一种常见的控件,它通常用于收集用户选择的选项。
为了确保这些选项是正确和有效的,我们可以使用JavaScript来验证下拉菜单的选项。
javascript制作的简单注册模块表单验证
javascript制作的简单注册模块表单验证javascript制作的简单注册模块表单验证通常在我们的HTML页面表单中有大量的数据验证工作,免不了要写很多验证表单的js代码,这是一项非常繁琐枯燥的工作。
很多程序员也会经常遗漏这项工作。
所以写了这一段JavaScript 代码提供给大家使用。
使用起来很简单,大家拿回去自由扩展吧一个注册框进行表单验证处理如图有简单的验证提示功能代码思路也比较简单输入框失去焦点时便检测,并进行处理表单具有onsubmit = "return check()"行为,处理验证情况点击提交表单按钮时,进行最终的验证,达到是否通过表单提交的请求。
先是最基本的html+css部分style type="text/css">body{margin:0;padding: 0;}.login{position:relative;margin:100px auto;padding:50px 20px;width: 350px;height: 200px;border:1px solid #333;} .login legend{font-weight: bold;color: green;text-align: center;}.login label{display:inline-block;width:130px;text-align: right;}.btn{height: 30px;width:100px;padding:5px;border:0;background-color: #00dddd;font-weight: bold;cursor: pointer;float: right;}input{height: 20px;width: 170px;}.borderRed{border: 2px solid red;}img{display: none;}style>head>body>div class="login">form name="form" method="post" action="register.php" onsubmit="return check()">legend>【Register】legend>p>label for="name">UserName: label>input type="text" id="name" >img src="./img/gou.png" width="20px"height="20px">p>p>label for="password">Password: label>input type="password" id="password" >img src="./img/gantan.png" width="20px"height="20px">p>p>label for="R_password">Password Again: label>input type="password" id="R_password" >img src="./img/gou.png" width="20px"height="20px">p>p>label for="email">Email: label>input type="text" id="email" >img src="./img/gou.png" width="20px"height="20px">p>p>input type="submit" value="Register"class="btn">p>form>div>然后是js的class相关处理函数function hasClass(obj,cls){ // 判断obj是否有此classreturn obj.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)'));}function addClass(obj,cls){ //给obj添加classif(!this.hasClass(obj,cls)){obj.className += " "+cls;}function removeClass(obj,cls){ //移除obj对应的classif(hasClass(obj,cls)){var reg = new RegExp('(\\s|^)' + cls + '(\\s|$)');obj.className = obj.className.replace(reg," ");}}然后是验证各个输入框的值function checkName(name){ //验证nameif(name != ""){ //不为空则正确,当然也可以ajax异步获取服务器判断用户名不重复则正确removeClass(,"borderRed"); //移除classdocument.images[0].setAttribute("src","./img/gou.png"); //对应图标document.images[0].style.display = "inline"; //显示return true;}else{ //name不符合addClass(,"borderRed"); //添加class document.images[0].setAttribute("src","./img/gantan.png"); //对document.images[0].style.display = "inline"; //显示return false;}}function checkPassw(passw1,passw2){ //验证密码if(passw1 == "" || passw2 == "" || passw1 !== passw2){ //两次密码输入不为空且不等不符合addClass(ele.password,"borderRed");addClass(ele.R_password,"borderRed");document.images[1].setAttribute("src","./img/gantan.png");document.images[1].style.display = "inline";document.images[2].setAttribute("src","./img/gantan.png");document.images[2].style.display = "inline";return false;}else{ //密码输入正确removeClass(ele.password,"borderRed");removeClass(ele.R_password,"borderRed");document.images[1].setAttribute("src","./img/gou.png");document.images[1].style.display = "inline";document.images[2].setAttribute("src","./img/gou.png");document.images[2].style.display = "inline";return true;}}function checkEmail(email){ //验证邮箱var pattern =/^([\.a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-])+/;if(!pattern.test(email)){ //email格式不正确addClass(ele.email,"borderRed");document.images[3].setAttribute("src","./img/gantan.png");document.images[3].style.display = "inline";ele.email.select();return false;}else{ //格式正确removeClass(ele.email,"borderRed");document.images[3].setAttribute("src","./img/gou.png");document.images[3].style.display = "inline";return true;}}然后为各个输入框添加监听事件:var ele = { //存放各个input字段objname: document.getElementById("name"),password: document.getElementById("password"),R_password: document.getElementById("R_password"),email: document.getElementById("email")};.onblur = function(){ //name失去焦点则检测checkName(.value);}ele.password.onblur = function(){ //password失去焦点则检测checkPassw(ele.password.value,ele.R_password.value);}ele.R_password.onblur = function(){ //R_password失去焦点则检测checkPassw(ele.password.value,ele.R_password.value);}ele.email.onblur = function(){ //email失去焦点则检测checkEmail(ele.email.value);}最后就是点击提交注册时调用的check()函数了function check(){ //表单提交则验证开始var ok = false;var nameOk = false;var emailOk = false;var passwOk = false;if(checkName(.value)){ nameOk = true; } //验证nameif(checkPassw(ele.password.value,ele.R_password.value)){ pass wOk = true; } //验证passwordif(checkEmail(ele.email.value)){ emailOk = true; } //验证emailif(nameOk && passwOk && emailOk){alert("Tip: Register Success .."); //注册成功//return true;}return false; //有误,注册失败}完整代码:html xmlns="/1999/xhtml">head>meta charset="utf-8">meta http-equiv="X-UA-Compatible"content="IE=edge,chrome=1">title>Registertitle>meta name="description" content="">meta name="keywords" content="">link href="" rel="stylesheet">style type="text/css">body{margin:0;padding: 0;}.login{position:relative;margin:100px auto;padding:50px 20px;width: 350px;height: 200px;border:1px solid #333;} .login legend{font-weight: bold;color: green;text-align: center;}.login label{display:inline-block;width:130px;text-align: right;}.btn{height: 30px;width:100px;padding:5px;border:0;background-color: #00dddd;font-weight:bold;cursor: pointer;float: right;}input{height: 20px;width: 170px;}.borderRed{border: 2px solid red;}img{display: none;}style>head>body>div class="login">form name="form" method="post" action="register.php" onsubmit="return check()">legend>【Register】legend>p>label for="name">UserName: label>input type="text" id="name" >img src="./img/gou.png" width="20px"height="20px">p>p>label for="password">Password: label>input type="password" id="password" >img src="./img/gantan.png" width="20px"height="20px">p>p>label for="R_password">Password Again: label>input type="password" id="R_password" >img src="./img/gou.png" width="20px"height="20px">p>p>label for="email">Email: label>input type="text" id="email" >img src="./img/gou.png" width="20px"height="20px">p>p>input type="submit" value="Register" class="btn">p> form>div>script type="text/javascript">function hasClass(obj,cls){ // 判断obj是否有此classreturn obj.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)'));}function addClass(obj,cls){ //给obj添加classif(!this.hasClass(obj,cls)){obj.className += " "+cls;}}function removeClass(obj,cls){ //移除obj对应的classif(hasClass(obj,cls)){var reg = new RegExp('(\\s|^)' + cls + '(\\s|$)');obj.className = obj.className.replace(reg," ");}}function checkName(name){ //验证nameif(name != ""){ //不为空则正确,当然也可以ajax异步获取服务器判断用户名不重复则正确removeClass(,"borderRed"); //移除classdocument.images[0].setAttribute("src","./img/gou.png"); //对应图标document.images[0].style.display = "inline"; //显示return true;}else{ //name不符合addClass(,"borderRed"); //添加classdocument.images[0].setAttribute("src","./img/gantan.png"); //对应图标document.images[0].style.display = "inline"; //显示return false;}}function checkPassw(passw1,passw2){ //验证密码if(passw1 == "" || passw2 == "" || passw1 !== passw2){ //两次密码输入不为空且不等不符合addClass(ele.password,"borderRed");addClass(ele.R_password,"borderRed");document.images[1].setAttribute("src","./img/gantan.png");document.images[1].style.display = "inline";document.images[2].setAttribute("src","./img/gantan.png");document.images[2].style.display = "inline";return false;}else{ //密码输入正确removeClass(ele.password,"borderRed");removeClass(ele.R_password,"borderRed");document.images[1].setAttribute("src","./img/gou.png");document.images[1].style.display = "inline";document.images[2].setAttribute("src","./img/gou.png");document.images[2].style.display = "inline";return true;}}function checkEmail(email){ //验证邮箱var pattern =/^([\.a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-])+/;if(!pattern.test(email)){ //email格式不正确addClass(ele.email,"borderRed");document.images[3].setAttribute("src","./img/gantan.png");document.images[3].style.display = "inline";ele.email.select();return false;}else{ //格式正确removeClass(ele.email,"borderRed");document.images[3].setAttribute("src","./img/gou.png");document.images[3].style.display = "inline";return true;}}var ele = { //存放各个input字段objname: document.getElementById("name"),password: document.getElementById("password"),R_password: document.getElementById("R_password"),email: document.getElementById("email")};.onblur = function(){ //name失去焦点则检测checkName(.value);}ele.password.onblur = function(){ //password失去焦点则检测checkPassw(ele.password.value,ele.R_password.value);}ele.R_password.onblur = function(){ //R_password失去焦点则检测checkPassw(ele.password.value,ele.R_password.value);}ele.email.onblur = function(){ //email失去焦点则检测checkEmail(ele.email.value);}function check(){ //表单提交则验证开始var ok = false;var nameOk = false;var emailOk = false;var passwOk = false;if(checkName(.value)){ nameOk = true; } //验证nameif(checkPassw(ele.password.value,ele.R_password.value)){ pass wOk = true; } //验证passwordif(checkEmail(ele.email.value)){ emailOk = true; } //验证emailif(nameOk && passwOk && emailOk){alert("Tip: Register Success .."); //注册成功//return true;}return false; //有误,注册失败}script>body>html>以上所述就是本文的全部内容了,希望能够对大家学习javascript表单验证有所帮助。
js-表单用户名密码及邮箱地址的验证
js-表单用户名密码及邮箱地址的验证第一篇:js-表单用户名密码及邮箱地址的验证js-表单用户名密码及邮箱地址的验证Better Form Validation---jsjingdian17.10改进的表单验证用户名:密码:--------------------------------验证邮箱地址Email:第二篇:C#验证用户名和密码//数据库连接,验证用户名和密码string testConnectionstring = “Data Source=(local);Initial Catalog=MyQQuser;Integrated Security=sspi”;SqlConnection con = new SqlConnection(testConnectionstring);string sql = “select Name,Password,Cname from QQuser”;SqlCommand com = new SqlCommand(sql, con);SqlDataAdapter da = new SqlDataAdapter();da.SelectCommand = com;con.Open();DataSet ds = new DataSet();da.Fill(ds, “QQuser”);DataRow nameRow;if(comboBox1.Text!= “"){if(textBox1.Text!= ”“){for(int i = 0;i < ds.T ables[”QQuser“].Rows.Count;i++){nameRow = ds.Tables[”QQuser“].Rows[i];if(nameRow[0].T oString().Trim()==comboBox1.Text.T oString().Trim()&&nameRow[1].ToString().Trim()== textBox1.Text.ToString().Trim()) {string sqlaaa = ”update QQuser set state='在线' where name='“ + comboBox1.Text + ”'“;SqlCommand comaaa = new SqlCommand(sqlaaa, con);comaaa.ExecuteNonQuery();//数据修改Form2 main = new Form2();main.lb.Text=boBox1.Text.T oString();main.lbname.T ext = nameRow[2].ToString();;main.Show();main.Te xt = ”欢迎你:“ + nameRow[2].ToString();//把数据库里的数据提取出来.Text = nameRow[2].ToString();main.notifyIcon1.T ext = nameRow[2].ToString()+ boBox1.Text;con.Close();main.Show();this.Hide();return;}}con.Close();//MessageBox.Show(”用户名或密码不正确“);if(MessageBox.Show(”用户名或密码不正确“,”错误“,MessageBoxButtons.OK,MessageBoxIcon.Error)== DialogResult.OK){textBox1.Text = ”“;}}else MessageBox.Show(”请输入密码!“);}else MessageBox.Show(”请输入账号和密码!“,”提示",MessageBoxButtons.OK,MessageBoxIcon.Asterisk);第三篇:js验证1.长度限制2.只能是汉字3.” 只能是英文4.只能是数字5.只能是英文字符和数字6.验证油箱格式7.屏蔽关键字(这里屏蔽***和****)8.两次输入密码是否相同够了吧屏蔽右键很酷oncontextmenu=”return false“ ondragstart=”return false“ onselectstart=”return false“ 加在body中二2.1 表单项不能为空2.2 比较两个表单项的值是否相同2.3 表单项只能为数字和”_“,用于电话/银行帐号验证上,可扩展到域名注册等2.4 表单项输入数值/长度限定2.5 中文/英文/数字/邮件地址合法性判断2.6 限定表单项不能输入的字符”%()>第四篇:验证用户名和密码的方法(共)java用户名密码验证示例代码分享作者:字体:[增加减小] 类型:转载这篇文章主要介绍了java用户名密码验证示例代码,需要的朋友可以参考下类:NameII 权限:public 方法:main 权限:public 参数:name,password,denglu,i;参数介绍: name,数据类型String,用来存储一个从 input 中获取的值,在本程序当中用作用户名的存放;password,数据类型 String,用来存储一个从 input 中获取的值,在本程序当中用作密码的存放;denglu,数据类型boolean,用来存储默认账户的登录状态,true 表示登录成功,false 表示尚未登录;i,数据类型int,用来存储一个用户尝试登录失败次数的值;方法功能: 在控制台输出“请输入用户名:”要求用户从控制台输入一个String 类型的数值存放到name当中;而后在控制台输出“请输入密码:”要求用户从控制台输入一个String 类型的数值存放在password当中;验证从控制台通过input 中获取的用户名和密码是否与默认的用户名和密码一致;如果一致,则输出“登录成功”,并更改用户登录状态 denglu 的值为 true ;如果不一致,提醒用户登录失败,将用户尝试登录失败的次数加1,并提醒用户账号剩余的尝试登录次数;用户尝试登录失败的次数达到3次,并提示用户名账号被冻结。
js正则表达式注册页面表单验证
js正则表达式注册页⾯表单验证正则表达式⽅式的验证⽅式,这个验证⽐较标准⽽且⽐较全⾯,不过也是通过点击提交按钮才进⾏验证,本实例可以这样验证,具体内容如下也可以这样验证具体代码<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>表单验证类Validator v1</title><style>body,td{font:normal 12px Verdana;color:#333333}input,textarea,select,td{font:normal 12px Verdana;color:#333333;border:1px solid #999999;background:#ffffff}table{border-collapse:collapse;}td{padding:3px}input{height:20;}textarea{width:80%;height:50px;overflow:auto;}form{display:inline}</style></head><body><table align="center"><form name="theForm" id="demo" method="get" onSubmit="return Validator.Validate(this,2)"><tr><td>⾝份证号:</td><td><input name="Card" dataType="IdCard" msg="⾝份证号错误"></td></tr><tr><td>真实姓名:</td><td><input name="Name" dataType="Chinese" msg="真实姓名只允许中⽂"></td></tr><tr><td>ID:</td><td><input name="username" dataType="Username" msg="ID名不符合规定"></td></tr><tr><td>英⽂名:</td><td><input name="Nick" dataType="English" require="false" msg="英⽂名只允许英⽂字母"></td></tr><tr><td>主页:</td><td><input name="Homepage" require="false" dataType="Url" msg="⾮法的Url"></td></tr><tr><td>密码:</td><td><input name="Password" dataType="SafeString" msg="密码不符合安全规则" type="password"></td></tr><tr><td>重复:</td><td><input name="Repeat" dataType="Repeat" to="Password" msg="两次输⼊的密码不⼀致" type="password"></td></tr><tr><td>信箱:</td><td><input name="Email" dataType="Email" msg="信箱格式不正确"></td></tr><tr><td>信箱:</td><td><input name="Email" dataType="Repeat" to="Email" msg="两次输⼊的信箱不⼀致"></td></tr><tr><td>QQ:</td><td><input name="QQ" require="false" dataType="QQ" msg="QQ号码不存在"></td></tr><tr><td>⾝份证:</td><td><input name="Card" dataType="IdCard" msg="⾝份证号码不正确"></td></tr><tr><td>年龄:</td><td><input name="Year" dataType="Range" msg="年龄必须在18~28之间" min="18" max="28"></td></tr><tr><td>年龄1:</td><td><input name="Year1" require="false" dataType="Compare" msg="年龄必须在18以上" to="18" operator="GreaterThanEqual"></td></tr><tr><td>电话:</td><td><input name="Phone" require="false" dataType="Phone" msg="电话号码不正确"></td></tr><tr><td>⼿机:</td><td><input name="Mobile" require="false" dataType="Mobile" msg="⼿机号码不正确"></td></tr><tr><td>⽣⽇:</td><td><input name="Birthday" dataType="Date" format="ymd" msg="⽣⽇⽇期不存在"></td></tr><tr><td>邮政编码:</td><td><input name="Zip" dataType="Custom" regexp="^[1-9]\d{5}$" msg="邮政编码不存在"></td></tr><tr><td>邮政编码:</td><td><input name="Zip1" dataType="Zip" msg="邮政编码不存在"></td></tr><tr><td>操作系统:</td><td><select name="Operation" dataType="Require" msg="未选择所⽤操作系统" ><option value="">选择您所⽤的操作系统</option><option value="Win98">Win98</option><option value="Win2k">Win2k</option><option value="WinXP">WinXP</option></select></td></tr><tr><td>所在省份:</td><td>⼴东<input name="Province" value="1" type="radio">陕西<input name="Province" value="2" type="radio">浙江<input name="Province" value="3" type="radio">江西<input name="Province" value="4" type="radio" dataType="Group" msg="必须选定⼀个省份" ></td></tr><tr><td>爱好:</td><td>运动<input name="Favorite" value="1" type="checkbox">上⽹<input name="Favorite" value="2" type="checkbox">听⾳乐<input name="Favorite" value="3" type="checkbox">看书<input name="Favorite" value="4" type="checkbox"" dataType="Group" min="2" max="3" msg="必须选择2~3种爱好"></td></tr><td>⾃我介绍:</td><td><textarea name="Description" dataType="Limit" max="10" msg="⾃我介绍内容必须在10个字之内">中⽂是⼀个字</textarea></td></tr><td>⾃传:</td><td><textarea name="History" dataType="LimitB" min="3" max="10" msg="⾃传内容必须在[3,10]个字节之内">中⽂是两个字节t</textarea></td> </tr><tr><td>相⽚上传:</td><td><input name="up" dataType="Filter" msg="⾮法的⽂件格式" type="file" accept="jpg, gif, png"></td></tr><tr><td colspan="2"><input name="Submit" type="submit" value="确定提交"><input onClick="Validator.Validate(document.getElementById('demo'))" value="检验模式1" type="button"><input onClick="Validator.Validate(document.getElementById('demo'),2)" value="检验模式2" type="button"><input onClick="Validator.Validate(document.getElementById('demo'),3)" value="检验模式3" type="button"></td></tr></form></table><script>Validator = {Require : /.+/,Email : /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/,Phone : /^((\d2,3)|(\d{3}\-))?(0\d2,3|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/,Mobile : /^((\d2,3)|(\d{3}\-))?13\d{9}$/,Url : /^http:\/\/[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/,IdCard : "this.IsIdCard(value)",Currency : /^\d+(\.\d+)?$/,Number : /^\d+$/,Zip : /^[1-9]\d{5}$/,QQ : /^[1-9]\d{4,8}$/,Integer : /^[-\+]?\d+$/,Double : /^[-\+]?\d+(\.\d+)?$/,English : /^[A-Za-z]+$/,Chinese : /^[\u0391-\uFFE5]+$/,Username : /^[a-z]\w{3,}$/i,UnSafe : /^(([A-Z]*|[a-z]*|\d*|[-_\~!@#\$%\^&\*\.\{\}<>\?\\\/\'\"]*)|.{0,5})$|\s/,IsSafe : function(str){return !this.UnSafe.test(str);},SafeString : "this.IsSafe(value)",Filter : "this.DoFilter(value, getAttribute('accept'))",Limit : "this.limit(value.length,getAttribute('min'), getAttribute('max'))",LimitB : "this.limit(this.LenB(value), getAttribute('min'), getAttribute('max'))",Date : "this.IsDate(value, getAttribute('min'), getAttribute('format'))",Repeat : "value == document.getElementsByName(getAttribute('to'))[0].value",Range : "getAttribute('min') < (value|0) && (value|0) < getAttribute('max')",Compare : "pare(value,getAttribute('operator'),getAttribute('to'))",Custom : "this.Exec(value, getAttribute('regexp'))",Group : "this.MustChecked(getAttribute('name'), getAttribute('min'), getAttribute('max'))", ErrorItem : [document.forms[0]],ErrorMessage : ["以下原因导致提交失败:\t\t\t\t"],Validate : function(theForm, mode){var obj = theForm || event.srcElement;var count = obj.elements.length;this.ErrorMessage.length = 1;this.ErrorItem.length = 1;this.ErrorItem[0] = obj;for(var i=0;i<count;i++){with(obj.elements[i]){var _dataType = getAttribute("dataType");if(typeof(_dataType) == "object" || typeof(this[_dataType]) == "undefined") continue; this.ClearState(obj.elements[i]);if(getAttribute("require") == "false" && value == "") continue;switch(_dataType){case "IdCard" :case "Date" :case "Repeat" :case "Range" :case "Compare" :case "Custom" :case "Group" :case "Limit" :case "LimitB" :case "SafeString" :case "Filter" :if(!eval(this[_dataType])) {this.AddError(i, getAttribute("msg"));}break;default :if(!this[_dataType].test(value)){this.AddError(i, getAttribute("msg"));}break;}}}if(this.ErrorMessage.length > 1){modemode = mode || 1;var errCount = this.ErrorItem.length;switch(mode){case 2 :for(var i=1;i<errCount;i++)this.ErrorItem[i].style.color = "red";case 1 :alert(this.ErrorMessage.join("\n"));this.ErrorItem[1].focus();break;case 3 :for(var i=1;i<errCount;i++){try{var span = document.createElement("SPAN");span.id = "__ErrorMessagePanel";span.style.color = "red";this.ErrorItem[i].parentNode.appendChild(span);span.innerHTML = this.ErrorMessage[i].replace(/\d+:/,"*");}catch(e){alert(e.description);}}this.ErrorItem[1].focus();break;default :alert(this.ErrorMessage.join("\n"));break;}return false;}return true;},limit : function(len,min, max){minmin = min || 0;maxmax = max || Number.MAX_VALUE;return min <= len && len <= max;},LenB : function(str){return str.replace(/[^ 00- ff]/g,"**").length;},ClearState : function(elem){with(elem){if(style.color == "red")style.color = "";var lastNode = parentNode.childNodes[parentNode.childNodes.length-1];if(lastNode.id == "__ErrorMessagePanel")parentNode.removeChild(lastNode);}},AddError : function(index, str){this.ErrorItem[this.ErrorItem.length] = this.ErrorItem[0].elements[index];this.ErrorMessage[this.ErrorMessage.length] = this.ErrorMessage.length + ":" + str; },Exec : function(op, reg){return new RegExp(reg,"g").test(op);},compare : function(op1,operator,op2){switch (operator) {case "NotEqual":return (op1 != op2);case "GreaterThan":return (op1 > op2);case "GreaterThanEqual":return (op1 >= op2);case "LessThan":return (op1 < op2);case "LessThanEqual":return (op1 <= op2);default:return (op1 == op2);}},MustChecked : function(name, min, max){var groups = document.getElementsByName(name);var hasChecked = 0;minmin = min || 1;maxmax = max || groups.length;for(var i=groups.length-1;i>=0;i--)if(groups[i].checked) hasChecked++;return min <= hasChecked && hasChecked <= max;},DoFilter : function(input, filter){return new RegExp("^.+\.(?=EXT)(EXT)$".replace(/EXT/g, filter.split(/\s*,\s*/).join("|")), "gi").test(input);},IsIdCard : function(number){var date, Ai;var verify = "10x98765432";var Wi = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];var area = ['','','','','','','','','','','','北京','天津','河北','⼭西','内蒙古','','','','','','辽宁','吉林','⿊龙江','','','','','','','','上海','江苏','浙江','安微','福建','江西','⼭东','','','','河南','湖北','湖南','⼴东','⼴西','海南','','','','重庆','四川','贵州','云南','西藏','','','','','','','陕西','⽢肃','青海','宁夏','新疆','','','','','','台湾 var re = number.match(/^(\d{2})\d{4}(((\d{2})(\d{2})(\d{2})(\d{3}))|((\d{4})(\d{2})(\d{2})(\d{3}[x\d])))$/i);if(re == null) return false;if(re[1] >= area.length || area[re[1]] == "") return false;if(re[2].length == 12){Ai = number.substr(0, 17);date = [re[9], re[10], re[11]].join("-");}else{Ai = number.substr(0, 6) + "19" + number.substr(6);date = ["19" + re[4], re[5], re[6]].join("-");}if(!this.IsDate(date, "ymd")) return false;var sum = 0;for(var i = 0;i<=16;i++){sum += Ai.charAt(i) * Wi[i];}Ai += verify.charAt(sum%11);return (number.length ==15 || number.length == 18 && number == Ai);},IsDate : function(op, formatString){formatStringformatString = formatString || "ymd";var m, year, month, day;switch(formatString){case "ymd" :m = op.match(new RegExp("^((\\d{4})|(\\d{2}))([-./])(\\d{1,2})\\4(\\d{1,2})$"));if(m == null ) return false;day = m[6];mmonth = m[5]*1;year = (m[2].length == 4) ? m[2] : GetFullYear(parseInt(m[3], 10));break;case "dmy" :m = op.match(new RegExp("^(\\d{1,2})([-./])(\\d{1,2})\\2((\\d{4})|(\\d{2}))$"));if(m == null ) return false;day = m[1];mmonth = m[3]*1;year = (m[5].length == 4) ? m[5] : GetFullYear(parseInt(m[6], 10));break;default :break;}if(!parseInt(month)) return false;monthmonth = month==0 ?12:month;var date = new Date(year, month-1, day);return (typeof(date) == "object" && year == date.getFullYear() && month == (date.getMonth()+1) && day == date.getDate());function GetFullYear(y){return ((y<30 ? "20" : "19") + y)|0;}}}</script></body></html>以上就是本⽂的全部内容,希望对⼤家的学习有所帮助,也希望⼤家多多⽀持。
Javascript经典案例javascript表单验证及事件
日期时间(Date)对象
格式: 对象名 = new Date ( [日期参数] ) 举例: today = new Date () //以当日时间为对象初值。
日期时间(Date)对象方法:
getYear()返回年份值 getMonth() 返回月份值 getDate() 并返回日期 getDay() 返回星期几 getHours() 返回小时数 getMinutes() 返回分钟数 getSeconds() 返回秒数 getTime() 返回完整的时间 setDate() 改变Date对象的日期 setHours() 改变小时数 setMinutes() 改变分钟数 setMonth() 改变月份 setSeconds() 改变秒数 setTime() 改变完整的时间 setYear() 改变年份 setTimeout 按照间隔时间(毫秒)来调用函数
表单验证的思路
<SCRIPT language = "JavaScript"> 同时调用验证用户 …… 名和验证密码方法 function validateform(){ if(checkUserName()&&passCheck( )) return true; else return false; } </SCRIPT> 表单的提交事件 …… <FORM name="myform" onSubmit="return validateform( )“ method="post" action="reg_success.htm" >…… <INPUT name="registerButton" type="submit" id="registerButton" value=" 登 录 " > 触发表单提交事件 ……
js常用正则表达式表单验证代码(最全面)
js 常用正则表达式表单验证代码方法一:var re=/正则表达式/;re.test($("txtid").val())方法二:$("txtid").val.match(/正则表达式/);附:验证数字的正则表达式集(转载)验证数字:^[0-9]*$验证n位的数字:^\d{n}$验证至少n位数字:^\d{n,}$验证m-n位的数字:^\d{m,n}$验证零和非零开头的数字:^(0|[1-9][0-9]*)$验证有两位小数的正实数:^[0-9]+(.[0-9]{2})?$验证有1-3位小数的正实数:^[0-9]+(.[0-9]{1,3})?$验证非零的正整数:^\+?[1-9][0-9]*$验证非零的负整数:^\-[1-9][0-9]*$验证非负整数(正整数+ 0)^\d+$验证非正整数(负整数+ 0)^((-\d+)|(0+))$验证长度为3的字符:^.{3}$验证由26个英文字母组成的字符串:^[A-Za-z]+$验证由26个大写英文字母组成的字符串:^[A-Z]+$验证由26个小写英文字母组成的字符串:^[a-z]+$验证由数字和26个英文字母组成的字符串:^[A-Za-z0-9]+$验证由数字、26个英文字母或者下划线组成的字符串:^\w+$验证用户密码:^[a-zA-Z]\w{5,17}$ 正确格式为:以字母开头,长度在6-18之间,只能包含字符、数字和下划线。
验证是否含有^%&',;=?$\" 等字符:[^%&',;=?$\x22]+验证汉字:^[\u4e00-\u9fa5],{0,}$验证Email地址:^\w+[-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$验证InternetURL:^http://([\w-]+\.)+[\w-]+(/[\w-./?%&=]*)?$ ;^[a-zA-z]+://(w+(-w+)*)(.(w+(-w+)*))*(?S*)?$验证电话号码:^(\(\d{3,4}\)|\d{3,4}-)?\d{7,8}$:--正确格式为:XXXX-XXXXXXX,XXXX-XXXXXXXX,XXX-XXXXXXX,XXX-XXXXXXXX,XXXXXXX,XXXXXXXX。
