javascript验证表单字段有效性，使用checkValidity()方法和他的属性

 <script type="text/javascript">
      function LoginCheckValidity()
      {
        var txt="";
        var rmb1=document.getElementById("rmb1");
        if(rmb1.checkValidity()==false)
        {
          if(rmb1.validitionMessage==undefined)
          {
            txt="输入金额有误,金额10-200之间";
          }
        }else
        {
          txt="转账成功！";
        }

        document.getElementById("rmb1msg").innerHTML=txt;
        
		//setCustomValidity()为自定义信息
        var rmb2=document.getElementById("rmb2");
        rmb2.setCustomValidity("");
        if(rmb2.value==null || rmb2.value=="")
        {
          rmb2.setCustomValidity("请输入金额！");
        }else if(rmb2.validity.rangeUnderflow)
        {
          rmb2.setCustomValidity("金额不小于10元");
        }else if(rmb2.validity.rangeOverflow)
        {
          rmb2.setCustomValidity("金额不大于200万");
        }else 
        {
          rmb2.setCustomValidity("转账成功！");
        }
        document.getElementById("rmb2msg").innerHTML=rmb2.validationMessage;
        rmb2=null;
        rmb1=null;
      }

      var input=document.getElementsByName("submit1")[0];
      EventUtil.addHandler(input,"click",LoginCheckValidity);
      input=null;
      
    </script>
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

//html部分

<div style="width:500px">
        <div style="width:250px;height:30px;line-height:30px;float:left;background:green;text-align:right;">
            转账金额1：<input id="rmb1" type="number"  min="10" max="200" name="rmb1" required="" size="20"/>
        </div>
        <div style="width:250px;height:30px;line-height:1px;float:left;background:black;color:red;">
            <p id="rmb1msg"></p>
        </div>
    </div>
    <div style="clear:both;"></div>
    <div style="width:500px;margin-top:10px;">
        <div style="width:250px;height:30px;line-height:30px;float:left;background:green;text-align:right;">
            转账金额2：<input id="rmb2" type="number"  min="10" max="200" name="rmb2" required="" size="20"/>
        </div>
        <div style="width:250px;height:30px;line-height:1px;float:left;background:black;color:red;">
            <p id="rmb2msg"></p>
        </div>
    </div>
    <div style="clear:both;"></div>
    <div style="float:left;margin-top:10px;"><input type="submit" name="submit1" value="验证" /></div>
    
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20