首页 > 技术文章 > js案例之使用正则表达式进行验证数据正确性

chenyameng 2019-09-17 19:04 原文

js案例之使用正则表达式进行验证数据正确性


代码上传至
"GitHub"


样例:

		<tr>
        <td>密码:</td>
        <td>
            <div data-toggle="tooltip" data-placement="right" title="请输入6位密码,必须含有英文">
                <input type="password" class="form-control" name="password" id="password" onblur="checkPass()">
            </div>
            <span id="passId"></span>
        </td>
    </tr>

提示框的是使用bootstrap进行提示:具体代码--->

<div data-toggle="tooltip" data-placement="right" title="请输入6位密码,必须含有英文">
                <input type="password" class="form-control" name="password" id="password" onblur="checkPass()">
            </div>

使用js的函数 onblur(),具体用法:onblur="checkPass()",当鼠标失去焦点的时候,自动执行该方法.

/**
         * 校验密码,一般为6位,全部为数字
         */
        function checkPass() {
            var password=document.getElementById("password").value;
            var regx=/^\w{6}$/;
            if (password.length>0){
                if (regx.test(password)){
                    passId.innerHTML="正确".fontcolor("green");
                    return true;
                }else {
                    passId.innerHTML="密码错误".fontcolor("red");
                    return false;
                }
            }else{
                passId.innerHTML="您没有输入密码,请输入".fontcolor("red");
                return false;
            }
        }

正则表达式的使用一般使用test方法进行测试即可,另外还有一种方法,用到的时候直接上网上百度即可,推荐的文章

"js正则表达式进行注册等信息校验"

1. 使用document.getElementById方法获取到用户输入的信息
2. 定义正则表达式规则。但是需要注意不用加“”,当定义正确后,idea环境下在最下脚会有提示是正则表达式。
3. 使用正则表达式的test方法进行校验
4. 如果检验成功,查找到对应的span元素进行innerHtml属性,进行赋值,然后添加属性fontcolor(“red”);进行提示即可。

其他的都是类似的情况。

推荐阅读