validate插件实现表单效验(一)

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>validate入门案例</title>
        <script src="../../js/jquery-1.8.3.js"></script>
        <!--validate js是建立在jquery之上的,所以先导入jquery库-->
        <script src="../../js/jquery.validate.min.js"></script>
        <script src="../../js/messages_zh.js"></script>
        <script type="text/javascript">
            $(function(){
                $("#checkForm").validate({
                        rules:{
                            username:{
                                required:true,
                                minlength:6
                            },
                            password:{
                                required:true,
                                digits:true,
                                minlength:6
                            }
                        },
                        messages:{
                            username:{
                                required:"用户名不能为空!",
                                minlength:"用户名不得少于6位"
                            },
                            password:{
                                required:"密码不能为空!",
                                digits:"密码必须是整数!",
                                minlength:"密码不得少于6位"
                            }
                        }
                        
                    });
            });
        </script>
    </head>
    <body>
        <form action="#" id="checkForm">
        用户名:<input type="text" name="username"/><br />
        密码: <input type="password" name="password" /> <br />
        <input type="submit" />
        </form>
    </body>
</html>

 

原文地址:https://www.cnblogs.com/benjamin77/p/9163259.html