1. 程式人生 > >Jquery Plugins Jquery Validate

Jquery Plugins Jquery Validate

query 數字 tro func dem 字符 後綴名 工具 下載

Jquery Validate

一.什麽是Jquery Validate:

jQuery Validate 插件為表單提供了強大的驗證功能。

二.常用值:

1 required:true 必須輸入的字段。
2 remote:"check.php" 使用 ajax 方法調用 check.php 驗證輸入值。
3 email:true 必須輸入正確格式的電子郵件。
4 url:true 必須輸入正確格式的網址。
5 date:true 必須輸入正確格式的日期。日期校驗 ie6 出錯,慎用。
6 dateISO:true 必須輸入正確格式的日期(ISO),例如:2009-06-23,1998/01/22。只驗證格式,不驗證有效性。
7 number:true 必須輸入合法的數字(負數,小數)。
8 digits:true 必須輸入整數。
9 creditcard: 必須輸入合法的信用卡號。
10 equalTo:"#field" 輸入值必須和 #field 相同。
11 accept: 輸入擁有合法後綴名的字符串(上傳文件的後綴)。
12 maxlength:5 輸入長度最多是 5 的字符串(漢字算一個字符)。
13 minlength:10 輸入長度最小是 10 的字符串(漢字算一個字符)。
14 rangelength:[5,10] 輸入長度必須介於 5 和 10 之間的字符串(漢字算一個字符)。
15 range:[5,10] 輸入值必須介於 5 和 10 之間。
16 max:5 輸入值不能大於 5。
17 min:10 輸入值不能小於 10。

三.Demo:

html:

<body>
    <div>
        <form id="form1" action="/" method="post">
            <
input type="text" name="Name" /><br /> <input id="Pwd" type="text" name="Pwd" /><br /> <input type="text" name="Pwd_ok" /><br /> <input type="text" name="Email" /><br /> <input type="text" name="Address" /><br /> <input type="text" name="Age" /><br /> <input type="submit" value="提交" /> </form> </div> </body>

js:

    <script type="text/javascript">
        $(function () {
            $("#form1").validate({
                rules: {
                    Name: {
                        required: true
                    },
                    Email: {
                        required: true,
                        email: true
                    },
                    Pwd: {
                        required: true,
                        digits: true,
                        rangelength: [5, 10]
                    },
                    Pwd_ok: {
                        required: true,
                        digits: true,
                        rangelength: [5, 10],
                        equalTo: "#Pwd"
                    }
                },
                messages: {
                    Name: {
                        required: "*請輸入名稱"
                    },
                    Email: {
                        required: "*郵箱不能空",
                        email: "*郵箱格式不正確"
                    }
                }
            })
        });

    </script>

四.下載:

菜鳥教程提供CDN:

http://static.runoob.com/download/jquery-validation-1.14.0.zip

如果使用的是visual studio IDE,可以直接使用Nuget 工具下載;

Jquery Plugins Jquery Validate