最近在做用户登录、注册、以及用户中心…然后之前在慕课网学的.用得着地方了，根据自己需求进行了细节修改，重要是样式方面吧。

第一次发表这些，说得不好不要介意，开始吧。首先：

$(“#form”).({

//在这里面编辑

});

验证的时候常常需要调试，该框架内置了一个方法，如下：

debug:true,   //调试模式（并不会提交）

来个实例，HTML:

用rules方法进行设置验证，然后需求是：必填项，长度在3-10之间：

$().ready((){

$(“#form”).({

debug:true,

//调试模式

rules:{

:{

:true,

//开启必填项:

//请输入的数值在3至10位之间

};

};

});

});

我的理解是，获取 name值 和 type类型来验证的。来个重新输入密码吧：

html:

js:

:{

:true,

:

},

“-“:{

:”#”   //必须密码相同

如果想要自定义提示消息呢，那就用方法吧：

:{

:{:”用户名不能留空”,

//用户名的必填项提示:”请检查您输入的数值的长度是否在2至10之间”

//用户名的长度提示}

下面说说样式方面吧，输入框提示错误时，class类变成error；输入框正确时，class类变成valid，所以不同情况，加不同颜色边框：

.form-group input.error{

-color: #;

.form-group input.valid {

-color: #;

提示的消息呢？输入框提示错误时，该便签会弹出，类名为error；输入框提示正确时，该便签会隐藏，并加了类名，那么：

.form-group span.error{

color: #;

.form-group span.{

: none;

其实还有很多方法的，如：、…基本能满足表单验证需求，演示那里有个demo，看看就明白啦。

文章内容请参见原文链接：