表单验证的思路--先屡清楚中文思路，再考虑代码如何实现

文／饥人谷_韩宝亿（简书作者）
原文链接：http://www.jianshu.com/p/55340bf14cfd
著作权归作者所有，转载请联系作者获得授权，并标注“简书作者”。

验证插件的思路

一、定义验证规则和出错信息

1.邮箱必须含有@

2.手机必须是数字

3.用户名最小长度为3，最大长度为30

Paste_Image.png

二、收集表单数据

1.获取所以有效的name(input[type=text]),radio,checkbox,select,textarea,input[type=hidden(注意input type为空时)]

2.根据name获取value（注意获取方式）

3.将所有value汇总到一个对象里

Paste_Image.png

三、对每条数据做验证

1.遍历所以数据

2.拿到name和value

3.根据name拿到rule

4.用rule来校验value

5.如果不成功，则整个表单校验不通过

6.返回最终结果

Paste_Image.png

四、返回最终结果

Paste_Image.png

五、提示出错信息

1.根据name找到出错的input

2.在input后面添加错误信息