jq插件学习---validate

Posted 2020-08-17

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jq插件学习---validate相关的知识，希望对你有一定的参考价值。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>validate</title>
        <script type="text/javascript" src="js/jquery-1.11.0.js" ></script>
        <script type="text/javascript" src="js/jquery.validate.js" ></script>
        <script type="text/javascript">
            
            $(function(){
                var vali=$("#testForm").validate({
                    rules:{
                        user:{
                            required:true,
//                            minlength:2,
//                            maxlength:10,
                            rangelength:[2,10],//长度范围
//                            remote:"jsonT/data.txt",//远程校验
//                            url:true,//url格式
//                            email:true,//邮箱格式
                            date:true,//日期格式
//                            dateISO:true,//标准日期格式yyyy-mm-dd 也可用/
//                            digits:true,//非负的整数
//                            number:true,
                        },
                        pass:{
                            required:true,
//                            minlength:2,
//                            maxlength:10,
//                            remote:{
//                                url:"",
//                                type:"post",
//                                data:{
//                                    
//                                }
//                            }
                        },
                        passre:{
                            equalTo:"#mima",//必须和谁相等
                        }
                    },
                    
                    messages:{
                        user:{
                            required:"必须填写用户名",
                            minlength:"用户名最小为2位",
                            maxlength:"用户名最大长度为10位"
                        },
                        pass:{
                            required:"必须填写密码",
                            minlength:"密码长度最小为2位",
                            maxlength:"密码长度最大为10"
                        }
                    }
                    
                });
                
                vali.showErrors({
                    pass:"你填错了",
                    user:"哟普你不用户名错了",
                })
                
                $("#check").click(function(){
                    alert($("#testForm").valid()?"填写正确":"填写错误");
                })
                
                
                
//                $("#mima").rules("add",{})//添加规则

                
                
                
            });
            
            
        </script>
    </head>
    <body>
        
        <form id="testForm">
            
            用户名<input type="text" placeholder="请输入用户名" name="user"/>
            密码<input type="password" id="mima" name="pass"/>
            确认密码<input type="password"  name="passre"/>
            <input type="submit" />
            <input type="button" id="check" />
        </form>
        
        
    </body>
</html>

以上是关于jq插件学习---validate的主要内容，如果未能解决你的问题，请参考以下文章

JQ插件机制

jq插件的编写方法（自定义jq插件）---转