站内搜索:
首页 >> 前端 >> 内容
JQuery validation插件代码教程

时间:2018/3/17 11:06:09

JQuery validation插件代码教程

<form id="demoForm">  
    <fieldset>  
        <legend>用户登陆</legend>  
        <p>  
            <label for="username">用户名</label>  
            <input type="text" id="username" name="username"/>  
        </p>  
  
        <p>  
            <label for="password">密码</label>  
            <input type="text" id="password" name="password"/>  
        </p>  
        <p>  
            <label for="cfpassword">再次输入密码</label>  
            <input type="text" id="password" name="cfpassword"/>  
        </p>  
        <p>  
            <input type="submit" value="登陆" />  
        </p>  
        </fieldset>  
</form>  

假设我们已经成功引入了JQuery-validation插件,以上我们建立了一个测试的界面

注意:

下面我们书写js时,

username/ password等均

是html的标签里name!!!

是name 不是id!!!

<script >  
    $("#demoForm").validate({  
        rules:{  
            debug:true,//实施检测  
            username:{  
                required:true,  
                minlength:2,  
                maxlength:10,  
            },  
            password:{  
                required:true,  
                minlength:2,  
                maxlength:10  
            },  
            cfpassword:{  
                equalTo:"#password"  
            }  
        },  
        messages:{  
  
        }  
    });  
</script>  

效果如图:

JQuery validation插件代码教程

  • 上一篇:CSS 控制&lt;table&gt;内容超出表格长度后自动隐藏教程
  • 下一篇:webpack4.1.1的使用详细教程
  • 返回顶部