网站首页  汉语字词  英语词汇  考试资料  写作素材  旧版资料

请输入您要查询的考试资料：

　

标题 JS表单验证的代码(常用)
内容
    最近没有项目做，有点空余时间，小编把日常比较常用的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>我的第一段 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表单验证，代码简单易懂，非常实用，希望对大家有所帮助
随便看

　

在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。

　

Copyright © 2002-2024 cuapp.net All Rights Reserved
更新时间：2025/5/21 14:23:01