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

文/饥人谷_韩宝亿(简书作者)
原文链接: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后面添加错误信息

转载于:https://www.cnblogs.com/hanbaoyi/p/5288067.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值