LDValidate/validator.html at master · lingdublog/LDValidate · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>LDValidator</title>
  <script src='js/ldvalidator.js'></script>
</head>
<body>
<div id="form">
  <div>
    年龄：<input type="text" name="age" />
  </div>
  <div>
    姓名：<input type="text" name="name" />
  </div>
  <div>
    重复姓名：<input type="text" name="rename" />
  </div>
  <button onclick="submit()">提交</button>
</div>


<script>

  var formValidator = new Validator('form', {
    age: {
      required: true,
      msg: 'age必填',
      scopes:[{
        min: 20,
        msg: 'age必须大于20'
      }, {
        max: 30,
        msg: 'age必须小于30'
      }],
      patterns: [{
        reg: /^[0-9]+$/,
        msg: 'age请填入数字'
      }],
    },
    name: {
      required: true,
      msg: 'name必填',
      patterns: [{
        reg: /^[a-zA-Z]+$/,
        msg: 'name请填入英文'
      }],
      equal: {
        name: 'rename',
        msg: '姓名和重复姓名不一致'
      }
    }
  });

  function submit (){
    // 必须先执行这一步
    formValidator.validate();
    // 这里才能获得结果
    if(formValidator.isPass){
      alert('通过');
    }else{
      console.log(formValidator.validation.msg);
      console.log(formValidator.validation.age.msg);
      console.log(formValidator.validation.name.msg);
    }
  }
</script>

</body>
</html>