• 7.4 Javascript:表单验证-揭开正則表達式的面纱


    用元字符匹配对应的字符类型

    创建正則表達式有点像创建字符串字面量,仅仅只是正則表達式出如今一对”/”里
    正則表達式中会用到一级元字符。用于连接字母与数字

    • “.” 匹配不论什么字符,除换行符外
    • “d”匹配不论什么数字字符
    • “w”匹配不论什么字母或数字字符
    • “s”匹配空格
    • “^”字符串需以模式起始
    • “$”字符串需以模式结束

    元字符不仅仅表示一个字面量字符,它乃是用于构建正則表達式的符号


    例:这里有三个字符
    “A”,”7”,”%”
    /w/能够匹配”A”,”7”
    /^d/能够匹配”7”
    /d/能够匹配”7”
    /./能够匹配”A”,”7”,”%”


    可是包括多个字符的字符串怎么办?
    “2nite”,”007”,”catch22”,
    /^d/可匹配到”2nite”,”007”(开头都是数字)
    /ddd/可匹配”007”(一行中有3个数字)
    /^cat/可匹配”catch22”(以cat字符开头)
    /dd$/可匹配”catch22”(必须以两个数字来结尾)


    比如:匹配美国邮编,邮编格式为#####-####
    /^ddddd-dddd$/


    用限定符指定字符出现的次数

    限定符用于控件子模式出现于正則表達式里的次数
    限定符前为子模式,限定符即应用在子模式,并控制子模式出如今模式里的次数

    • “*”限定符前的子模式必须出现0次或多次
    • “+”限定符前的子模式必须出现1次或多次
    • “?”限定符前的子模式必须出现0次或1次
    • “{n}”限定符前的子模式必须恰好出现N次
    • “()”集合字符或/和元字符,成为子模式

    相同是以邮政编码为例
    /^d{5}-d{4}$/
    能够看出,加上限定符的表达式比仅仅有元字符的表达式更加的精准
    /w*/匹配不论什么字母数字字符,包括空字符串
    /.+/匹配一个出现一次以上的字符串(用于匹配非非空的字符串)
    /(Hot)??

    Donuts/可匹配出Hot或Donuts


    *在正則表達式里想要匹配具有特殊意义的字符的时候,能够用反斜杠
    比如匹配$:$*


    利用正則表達式验证数据
    JavaScript里的正則表達式由RegExp对象表示,当中包括使用正則表達式验证数据的关键–test()方法,它检查字符串里是否存在指定的模式


    例:
    var regex=/^d{5}$/;//匹配5位数邮政编码的正則表達式;
    正則表達式对象字面量自己主动合建RegExp对象

    if(!regex.test(inputFiled.value))
    {
    //在正則表達式上调用text方法
    //假设符合合正則表達式的要求,返回true
    //假设不符合正則表達式的要求,返回false
    }


    代码案例

    接下来,写一个专门用来验证字符串格式的方法

    //regex正則表達式
    //inputStr须要验证的字符串
    //helpText提供信息提示的一个span标签
    //helpMessage提示信息内容
    //
    function validateRegExp(regex,inputStr,helpText,helpMessage)
    {
        if(!regex.test(inputStr))
        {
            if(helpText!=null)
            helpText.innerHTML=helpMessage;
            return false;
            }
        else{
            if(helpText!=null)
            helpText.innerHTML="";
            }
        return true;
        }
    
    
    function validateDate(inputFild,helpText)
    {
        if(!validateNonEmpty(inputFild,helpText)//先检查參数是非空的
        {
            return false;
            }
        return validateRegExp(/^d{2}/d{2}/d{4}$/,inputFild,helpText,"请输入正确的日期格式");//调用正则验证方法
        }
  • 相关阅读:
    [bzoj4653] [NOI2016]区间
    [bzoj5285] [HNOI2018]寻宝游戏
    [bzoj4071] [Apio2015]巴邻旁之桥
    [bzoj1146] [CTSC2008]网络管理Network
    [bzoj3004] [SDOi2012]吊灯
    [bzoj5321] [Jxoi2017]加法
    [bzoj5010] [FJOI2017]矩阵填数
    [bzoj3504] [CQOI2014]危桥
    ASP.NET
    ASP.NET
  • 原文地址:https://www.cnblogs.com/mfmdaoyou/p/7388453.html
Copyright © 2020-2023  润新知