最近没有项目做,有点空余时间,小编把日常比较常用的js表单验证代码整理分享到脚本之家平台,供大家学习,需要的朋友参考下吧!
注册验证:
<script language="JavaScript" src="js/jquery-1.9.1.min.js" type="text/javascript"></script> //验证表单 function vailForm(){ var form = 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(); } //验证昵称 function vailNickName(){ var nickName = jQuery("#nickName").val(); var flag = false; var message = ""; var patrn=/^\d+$/; var length = getNickNameLength(); if(nickName == ''){ message = "昵称不能为空!"; }else if(length<4||length>16){ message = "昵称为4-16个字符!"; } else if(checkNickNameIsExist()){ message = "该昵称已经存在,请重新输入!"; }else{ flag = true; } if(!flag){ jQuery("#nickNameDiv").removeClass().addClass("ui-form-item has-error"); jQuery("#nickNameP").html(""); jQuery("#nickNameP").html("<i class=\"icon-error ui-margin-right10\"> <\/i>"+message); //jQuery("#nickName").focus(); }else{ jQuery("#nickNameDiv").removeClass().addClass("ui-form-item has-success"); jQuery("#nickNameP").html(""); jQuery("#nickNameP").html("<i class=\"icon-success ui-margin-right10\"> <\/i>该昵称可用"); } return flag; } //计算昵称长度 function getNickNameLength(){ var nickName = jQuery("#nickName").val(); var len = 0; for (var i = 0; i < nickName.length; i++) { var a = nickName.charAt(i); //函数格式:stringObj.match(rgExp) stringObj为字符串必选 rgExp为正则表达式必选项 //返回值:如果能匹配则返回结果数组,如果不能匹配返回null if (a.match(/[^\x00-\xff]/ig) != null){ len += 2; }else{ len += 1; } } return len; } //验证昵称是否存在 function checkNickNameIsExist(){ var nickName = jQuery("#nickName").val(); var flag = false; jQuery.ajax( { url: "checkNickName?t=" + (new Date()).getTime(), data:{nickName:nickName}, dataType:"json", type:"GET", async:false, success:function(data) { var status = data.status; if(status == "1"){ flag = true; } } }); return flag; } //验证手机号 function vailPhone(){ var phone = jQuery("#phone").val(); var flag = false; var message = ""; //var myreg = /^(((13[0-9]{1})|159|153)+\d{8})$/; var myreg = /^(((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 = "手机号码不能为空!"; }else if(phone.length !=11){ message = "请输入有效的手机号码!"; }else if(!myreg.test(phone)){ message = "请输入有效的手机号码!"; }else if(checkPhoneIsExist()){ message = "该手机号码已经被绑定!"; }else{ flag = true; } if(!flag){ jQuery("#phoneDiv").removeClass().addClass("ui-form-item has-error"); jQuery("#phoneP").html(""); jQuery("#phoneP").html("<i class=\"icon-error ui-margin-right10\"> <\/i>"+message); //jQuery("#phone").focus(); }else{ jQuery("#phoneDiv").removeClass().addClass("ui-form-item has-success"); jQuery("#phoneP").html(""); jQuery("#phoneP").html("<i class=\"icon-success ui-margin-right10\"> <\/i>该手机号码可用"); } return flag; } //验证手机号是否存在 function checkPhoneIsExist(){ var phone = jQuery("#phone").val(); var flag = true; jQuery.ajax( { url: "checkPhone?t=" + (new Date()).getTime(), data:{phone:phone}, dataType:"json", type:"GET", async:false, success:function(data) { var status = data.status; if(status == "0"){ flag = false; } } }); return flag; } //验证密码 function vailPwd(){ var password = jQuery("#password").val(); var flag = false; var message = ""; var patrn=/^\d+$/; if(password ==''){ message = "密码不能为空!"; }else if(password.length<6 || password.length>16){ message = "密码6-16位!"; }else if(patrn.test(password)){ message = "密码不能全是数字!"; }else{ flag = true; } if(!flag){ jQuery("#passwordDiv").removeClass().addClass("ui-form-item has-error"); jQuery("#passwordP").html(""); jQuery("#passwordP").html("<i class=\"icon-error ui-margin-right10\"> <\/i>"+message); //jQuery("#password").focus(); }else{ jQuery("#passwordDiv").removeClass().addClass("ui-form-item has-success"); jQuery("#passwordP").html(""); jQuery("#passwordP").html("<i class=\"icon-success ui-margin-right10\"> <\/i>该密码可用"); } return flag; } //验证确认密码 function vailConfirmPwd(){ var confirmPassword = jQuery("#confirm_password").val(); var patrn=/^\d+$/; var password = jQuery("#password").val(); var flag = false; var message = ""; if(confirmPassword == ''){ message = "请输入确认密码!"; }else if(confirmPassword != password){ message = "二次密码输入不一致,请重新输入!"; }else if(patrn.test(password)){ message = "密码不能全是数字!"; }else { flag = true; } if(!flag){ jQuery("#confirmPasswordDiv").removeClass().addClass("ui-form-item has-error"); jQuery("#confirmPasswordP").html(""); jQuery("#confirmPasswordP").html("<i class=\"icon-error ui-margin-right10\"> <\/i>"+message); //jQuery("#confirm_password").focus(); }else{ jQuery("#confirmPasswordDiv").removeClass().addClass("ui-form-item has-success"); jQuery("#confirmPasswordP").html(""); jQuery("#confirmPasswordP").html("<i class=\"icon-success ui-margin-right10\"> <\/i>密码正确"); } return flag; } //验证邮箱 function vailEmail(){ var email = jQuery("#email").val(); var flag = false; var message = ""; var myreg = /^([\.a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-])+/; if(email ==''){ message = "邮箱不能为空!"; }else if(!myreg.test(email)){ message = "请输入有效的邮箱地址!"; }else if(checkEmailIsExist()){ message = "该邮箱地址已经被注册!"; }else{ flag = true; } if(!flag){ jQuery("#emailDiv").removeClass().addClass("ui-form-item has-error"); jQuery("#emailP").html(""); jQuery("#emailP").html("<i class=\"icon-error ui-margin-right10\"> <\/i>"+message); //jQuery("#email").focus(); }else{ jQuery("#emailDiv").removeClass().addClass("ui-form-item has-success"); jQuery("#emailP").html(""); jQuery("#emailP").html("<i class=\"icon-success ui-margin-right10\"> <\/i>该邮箱可用"); } return flag; } //验证邮箱是否存在 function checkEmailIsExist(){ var email = jQuery("#email").val(); var flag = false; jQuery.ajax( { url: "checkEmail?t=" + (new Date()).getTime(), data:{email:email}, dataType:"json", type:"GET", async:false, success:function(data) { var status = data.status; if(status == "1"){ flag = true; } } }); return flag; } //验证验证码 function vailCode(){ var randCode = jQuery("#randCode").val(); var flag = false; var message = ""; if(randCode == ''){ message = "请输入验证码!"; }else if(!checkCode()){ message = "验证码不正确!"; }else{ flag = true; } if(!flag){ jQuery("#randCodeDiv").removeClass().addClass("ui-form-item has-error"); jQuery("#randCodeP").html(""); jQuery("#randCodeP").html("<i class=\"icon-error ui-margin-right10\"> <\/i>"+message); //jQuery("#randCode").focus(); }else{ jQuery("#randCodeDiv").removeClass().addClass("ui-form-item has-success"); jQuery("#randCodeP").html(""); jQuery("#randCodeP").html("<i class=\"icon-success ui-margin-right10\"> <\/i>"); } return flag; } //检查随机验证码是否正确 function checkCode(){ var randCode = jQuery("#randCode").val(); var flag = false; jQuery.ajax( { url: "checkRandCode?t=" + (new Date()).getTime(), data:{randCode:randCode}, dataType:"json", type:"GET", async:false, success:function(data) { var status = data.status; if(status == "1"){ flag = true; } } }); return flag; } //判断是否选中 function vailAgree(){ if(jQuery("#agree").is(":checked")){ return true; }else{ alert("请确认是否阅读并同意XX协议"); } return false; } function delHtmlTag(str){ var str=str.replace(/<\/?[^>]*>/gim,"");//去掉所有的html标记 var result=str.replace(/(^\s+)|(\s+$)/g,"");//去掉前后空格 return result.replace(/\s/g,"");//去除文章中间空格}<!DOCTYPE html><html><body><h1 id="我的第一段-JavaScript">我的第一段 JavaScript</h1><p>请输入数字。如果输入值不是数字,浏览器会弹出提示框。</p><input id="demo" type="text"><script>function myFunction(){var x=document.getElementById("demo").value;if(x==""){ alert("输入不能为空"); return;}if(isNaN(x)){ alert("请输入数字"); return;}if(x.length!=6){ alert("请输入6位数字"); return;}}</script><button type="button" onclick="myFunction()">点击这里</button></body></html> //验证密码为数字字母下划线 function CheckPwd(pwd) { var validStr = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789_~/!@#$%^&*();-+.=,"; for (i = 0; i < pwd.length; i++) { if (validStr.indexOf(pwd.charAt(i)) == -1) { return false; } } return true; } //验证邮箱格式 function checkemail(email) { var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/; if (!filter.test(email)) { return false; } return true; } function isEmail(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); } ///手机号码验证 function checktelephone(cellPhone) { var RegCellPhone = /^([0-9]{11})?$/; falg = cellPhone.search(RegCellPhone); if (falg == -1) { return false; } else { return true; } } //获取URL参数值 function getParameter(param) { var query = window.location.search; var iLen = param.length; var iStart = query.indexOf(param); if (iStart == -1) return ""; iStart += iLen + 1; var iEnd = query.indexOf("&", iStart); if (iEnd == -1) return query.substring(iStart); return query.substring(iStart, iEnd); }
以上代码是小编给大家介绍的js表单验证,代码简单易懂,非常实用,希望对大家有所帮助,同时也非常感谢大家对脚本之家网站的支持!

JavaScript ist die Kernsprache der modernen Webentwicklung und wird für seine Vielfalt und Flexibilität häufig verwendet. 1) Front-End-Entwicklung: Erstellen Sie dynamische Webseiten und einseitige Anwendungen durch DOM-Operationen und moderne Rahmenbedingungen (wie React, Vue.js, Angular). 2) Serverseitige Entwicklung: Node.js verwendet ein nicht blockierendes E/A-Modell, um hohe Parallelitäts- und Echtzeitanwendungen zu verarbeiten. 3) Entwicklung von Mobil- und Desktop-Anwendungen: Die plattformübergreifende Entwicklung wird durch reaktnative und elektronen zur Verbesserung der Entwicklungseffizienz realisiert.

Zu den neuesten Trends im JavaScript gehören der Aufstieg von Typenkripten, die Popularität moderner Frameworks und Bibliotheken und die Anwendung der WebAssembly. Zukunftsaussichten umfassen leistungsfähigere Typsysteme, die Entwicklung des serverseitigen JavaScript, die Erweiterung der künstlichen Intelligenz und des maschinellen Lernens sowie das Potenzial von IoT und Edge Computing.

JavaScript ist der Eckpfeiler der modernen Webentwicklung. Zu den Hauptfunktionen gehören eine ereignisorientierte Programmierung, die Erzeugung der dynamischen Inhalte und die asynchrone Programmierung. 1) Ereignisgesteuerte Programmierung ermöglicht es Webseiten, sich dynamisch entsprechend den Benutzeroperationen zu ändern. 2) Die dynamische Inhaltsgenerierung ermöglicht die Anpassung der Seiteninhalte gemäß den Bedingungen. 3) Asynchrone Programmierung stellt sicher, dass die Benutzeroberfläche nicht blockiert ist. JavaScript wird häufig in der Webinteraktion, der einseitigen Anwendung und der serverseitigen Entwicklung verwendet, wodurch die Flexibilität der Benutzererfahrung und die plattformübergreifende Entwicklung erheblich verbessert wird.

Python eignet sich besser für Datenwissenschaft und maschinelles Lernen, während JavaScript besser für die Entwicklung von Front-End- und Vollstapel geeignet ist. 1. Python ist bekannt für seine prägnante Syntax- und Rich -Bibliotheks -Ökosystems und ist für die Datenanalyse und die Webentwicklung geeignet. 2. JavaScript ist der Kern der Front-End-Entwicklung. Node.js unterstützt die serverseitige Programmierung und eignet sich für die Entwicklung der Vollstapel.

JavaScript erfordert keine Installation, da es bereits in moderne Browser integriert ist. Sie benötigen nur einen Texteditor und einen Browser, um loszulegen. 1) Führen Sie sie in der Browser -Umgebung durch, indem Sie die HTML -Datei durch Tags einbetten. 2) Führen Sie die JavaScript -Datei nach dem Herunterladen und Installieren von node.js nach dem Herunterladen und Installieren der Befehlszeile aus.

So senden Sie im Voraus Aufgabenbenachrichtigungen in Quartz Wenn der Quartz -Timer eine Aufgabe plant, wird die Ausführungszeit der Aufgabe durch den Cron -Ausdruck festgelegt. Jetzt...

So erhalten Sie die Parameter von Funktionen für Prototyp -Ketten in JavaScript in JavaScript -Programmier-, Verständnis- und Manipulationsfunktionsparametern auf Prototypungsketten ist eine übliche und wichtige Aufgabe ...

Analyse des Grundes, warum der dynamische Verschiebungsfehler der Verwendung von VUE.JS im WeChat Applet Web-View Vue.js verwendet ...


Heiße KI -Werkzeuge

Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool
Ausziehbilder kostenlos

Clothoff.io
KI-Kleiderentferner

AI Hentai Generator
Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

Heiße Werkzeuge

Sicherer Prüfungsbrowser
Safe Exam Browser ist eine sichere Browserumgebung für die sichere Teilnahme an Online-Prüfungen. Diese Software verwandelt jeden Computer in einen sicheren Arbeitsplatz. Es kontrolliert den Zugriff auf alle Dienstprogramme und verhindert, dass Schüler nicht autorisierte Ressourcen nutzen.

Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor

Dreamweaver CS6
Visuelle Webentwicklungstools

MinGW – Minimalistisches GNU für Windows
Dieses Projekt wird derzeit auf osdn.net/projects/mingw migriert. Sie können uns dort weiterhin folgen. MinGW: Eine native Windows-Portierung der GNU Compiler Collection (GCC), frei verteilbare Importbibliotheken und Header-Dateien zum Erstellen nativer Windows-Anwendungen, einschließlich Erweiterungen der MSVC-Laufzeit zur Unterstützung der C99-Funktionalität. Die gesamte MinGW-Software kann auf 64-Bit-Windows-Plattformen ausgeführt werden.

PHPStorm Mac-Version
Das neueste (2018.2.1) professionelle, integrierte PHP-Entwicklungstool