zoukankan      html  css  js  c++  java
  • 正则判断表单输入

    简单的表单验证,直接上代码,初学正则,加油加油!

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>表单验证</title>
    </head>
    <body>
        <form action="" >
            <ul>
                <li>用户账号:<input type="text" id="count" onblur="checkCount()"><span id="countwr"></span></li>
                <li>真实姓名:<input type="text" id="name" onblur="checkName()"><span id="namewr"></span></li>
                <li>输入密码:<input type="password" id="password" onblur="checkPassword()"><span id="passwordwr"></span></li>
                <li>确认密码:<input type="password" id="pdConfirm" onblur="chenckPdconfirm()"><span id="pdConfirmwr"></span></li>
            </ul>
            <button type="submit" id="hidden-window-yes" >确定</button>
        </form>
        <script>
            //验证账号
            function checkCount() {
                var exp = /^([0-9]{6})$/;
                var count = document.getElementById("count").value;
                var countwr=document.getElementById("countwr");
                console.log(exp.test(count));
                if(exp.test(count)){
                    countwr.innerText = "输入正确!";
                    countwr.style.color="green";
                    return true;
                }
                else {
                    countwr.innerText = "请输入六位数字!";
                    countwr.style.color="red";
                    return false;
                }
            }
            //验证姓名
            function checkName() {
                var exp = /^([u4E00-u9FA5]+)$/;
                var name = document.getElementById("name").value;
                var namewr =document.getElementById("namewr");
                console.log(exp.test(name));
                if(exp.test(name)) {
                    namewr.innerText = "输入正确!";
                    namewr.style.color="green";
                    return true;
                }
                else {
                    namewr.innerText = "输入错误!";
                    namewr.style.color = "red";
                    return false;
                }
    
            }
                    
            //验证密码
            function    checkPassword() {
                var exp =/^([0-9a-z]{8})$/;
                var password = document.getElementById("password").value;
                var passwordwr = document.getElementById("passwordwr");
                if(exp.test(password)) {
                    passwordwr.innerText="输入正确!";
                    passwordwr.style.color="green";
                    return true;
                }
                else{
                    passwordwr.innerText = "输入错误!";
                    passwordwr.style.color = "red";
                    return false;
                }
            }
            //验证确认密码
            function  chenckPdconfirm() {
                var password = document.getElementById("password").value;
                var pdConfirm = document.getElementById("pdConfirm").value;
                var pdConfirmwr = document.getElementById("pdConfirmwr");
                if(password == pdConfirm) {
                    pdConfirmwr.innerText="密码匹配!";
                    pdConfirmwr.style.color="green";
                    return true;
                }
                else {
                    pdConfirmwr.innerText="密码不匹配!";
                    pdConfirmwr.style.color="red";
                    return false;
                }
    
            }
        
        </script>
    </body>
    </html>
  • 相关阅读:
    Windbg使用
    C#与C++之间类型的对应
    Hook CreateProcess
    基于EasyHook实现监控explorer资源管理器文件复制、删除、剪切等操作
    GUID和UUID、CLSID、IID 区别及联系
    hook C++
    EasyHook Creating a remote file monitor
    hook工具
    EasyHook
    Hook exe 和 file
  • 原文地址:https://www.cnblogs.com/xiaoluoli/p/5853571.html
Copyright © 2011-2022 走看看