适用于大部分正则判断输入

开发工具与关键技术：Visual Studio html css javascript
作者：华境聪
撰写时间：2019/1/18
包含个人对正则判断及使用。适用大多数正则判断，可供大家参考学习。
关键点：对正则判断式的了解；“maxlength”限制最大长度；改变提示信息并返回””；


@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>zheze</title>
    <script src="~/Content/jquery-2.0.3.min.js"></script>
    <style>
        .first{
            margin-top:10px;
        }
    </style>
</head>
<body>
    <div> 
        <div class="first">身份证号： <input id="identity" maxlength="19"/></div> 
        <div class="first">电话号码： <input id="phone" maxlength="13"/></div>
        <div class="first">日期： <input id="date" placeholder="yyyy-mm-dd" maxlength="12"/></div>
        <div class="first">汉字： <input id="hanzi" /></div>
        <div class="first">数字： <input id="figure" /></div>
        <div class="first">所有字母： <input id="letter" /></div>
        <div class="first">大写字母： <input id="bigletter" /></div>
        <div class="first">小写字母： <input id="xiaoletter" /></div>
        <div class="first">不能由特殊字符只能由数字、大小写字母组成： <input id="kong" /></div>
    </div>
    <script>
        $('#identity').blur(function () {
            var identity = document.getElementById("identity").value;
            if (/^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{4}$/.test(identity)) {
            }else{
                document.getElementById("identity").value = '';
                document.getElementById("identity").setAttribute("placeholder", "身份证号不正确请重新输入");
            };
        })
        $('#phone').blur(function () {
            var phone = document.getElementById("phone").value;
            if (/^(13[0-9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$/.test(phone)) {
            } else {
                document.getElementById("phone").value = '';
                document.getElementById("phone").setAttribute("placeholder", "电话号码不正确请重新输入");
            };
        })
        $('#date').blur(function () {
            var date = document.getElementById("date").value;
            if (/^(?:(?!0000)[0-9]{4}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:0[13-9]|1[0-2])-(?:29|30)|(?:0[13578]|1[02])-31)|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)-02-29)$/.test(date)) {
            } else {
                document.getElementById("date").value = '';
                document.getElementById("date").setAttribute("placeholder", "日期格式不正确请重新输入");
            };
        })
        $('#hanzi').blur(function () {
            var hanzi = document.getElementById("hanzi").value;
            if (/^[\u4e00-\u9fa5]$/.test(hanzi)) {
            } else {
                document.getElementById("hanzi").value = '';
                document.getElementById("hanzi").setAttribute("placeholder", "格式不正确请重新输入");
            };
        })
        $('#figure').blur(function () {
            var figure = document.getElementById("figure").value;
            if (/^[0-9]$/g.test(figure)) {
            } else {
                document.getElementById("figure").value = '';
                document.getElementById("figure").setAttribute("placeholder", "格式不正确请重新输入");
            };
        })
        $('#letter').blur(function () {
            var letter = document.getElementById("letter").value;
            if (/[A-Za-z]$/g.test(letter)) {
            } else {
                document.getElementById("letter").value = '';
                document.getElementById("letter").setAttribute("placeholder", "格式不正确请重新输入");
            };
        })
        $('#bigletter').blur(function () {
            var bigletter = document.getElementById("bigletter").value;
            if (/^[A-Z]$/.test(bigletter)) {
            } else {
                document.getElementById("bigletter").value = '';
                document.getElementById("bigletter").setAttribute("placeholder", "格式不正确请重新输入");
            };
        })
        $('#xiaoletter').blur(function () {
            var xiaoletter = document.getElementById("xiaoletter").value;
            if (/^[a-z]$/.test(xiaoletter)) {
            } else {
                document.getElementById("xiaoletter").value = '';
                document.getElementById("xiaoletter").setAttribute("placeholder", "格式不正确请重新输入");
            };
        })
        $('#kong').blur(function () {
            var kong = document.getElementById("kong").value;
            if (/[A-Za-z0-9]$/.test(kong)) {
            } else {
                document.getElementById("kong").value = '';
                document.getElementById("kong").setAttribute("placeholder", "格式不正确请重新输入");
            };
        })
    </script>
</body>
</html>

以及输出的截图:
在这里插入图片描述

在这里就不一一演示了，需要的话自己测试下，最主要还是理解。

适用于大部分正则判断输入

猜你喜欢