master

分支 (1)

管理

管理

master

valid.js
/
test.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form action="/user/register" method="post">
        用户名：<input type="text" name="username"><span></span><br>
        密码：<input type="password" name="password"><span></span><br>
        真实姓名：<input type="text" name="realname"><span></span><br>
        年龄：<input type="number" name="age"><span></span><br>
        性别：<input type="text" name="sex"><span></span><br>
        生日：<input type="date" name="birthday"><span></span><br>
        薪水：<input type="text" name="salary"><span></span><br>
        工作进度：<input type="text" name="winRate"><span></span><br>
        邮箱：<input type="email" name="email"><span></span><br>
        <br>
        <input type="submit" value="注册">
    </form>
</body>
<script src="./valid.js"></script>
<script>
    valid(document.querySelector("form"),{
        rules: {
            username: {
                pattern: "^\\w{6,10}$",
                required: true,
            },
            password: {
                pattern: "^\\w{6,10}$",
                equalsTo: "input[name=username]",
                required: true
            },
            realname: {
                required: true
            },
            sex:{
                pattern: "^[男女]$",
                required: true,
            },
            age: {
                min: 1,
                max: 120
            },
            birthday: {
                required: true,
                past: true
            },
            salary: {
                pattern: "￥(?=[\\.,]*)\\d+",
            },
            winRate: {
                pattern: "^(\\d{1,2}|100)%$"
            },
            email: {
                email: true
            }
        },
        messages: {
            username: "用户名必须是6-10位数字或字母",
            password: "密码必须等于用户名",
            realname: "真实姓名必填",
            sex: "你是什么魔鬼?",
            age: "你是妖怪吗？",
            birthday: "生日必须是过去的时间",
            salary: "薪水格式不对",
            winRate: "工作进度格式不对",
            email: "邮箱格式不对"
        },
        trigger: "blur",
        settings: {
            username: (item, res) => {
                console.log(item,res)
            },
            password: (item, res) => {
                console.log(item)
            }
        }
    })
</script>
</html>