jquery+正则实现统一的表单验证
2019/6/29 21:53:38
本文主要是介绍jquery+正则实现统一的表单验证,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
表单验证一直很繁琐,特别是大点的表单,如果每个input都去单独写验证简直要写死人,最近写了一小段js统一的验证表单内容是否正确。
使用这段代码就不再需要对每个input写格式判断,只需要将正确格式的正则表达式写在datatype里就可以了,提交表单按钮也只需要绑定checkForm函数就可以了。
大家有什么建议可以评论一下
<input type="text" datatype=“正则”/> //表单验证 //点击下一步事件 function checkForm(form){ var success = true; $("."+form+" input").each(function(){ var $that = $(this); var dataType = eval($that.attr("dataType")); if(dataType!=undefined){ if($that.val().match(dataType)){ $that.removeClass("borderRed"); }else{ $that.focus(); $that.addClass("borderRed"); success = false; return false; } } }) return success; } //给每个带有datatype属性的标签绑定blur focus事件 $(document).on("blur","input",function(){ var $that = $(this); var dataType = eval($that.attr("dataType")); if(dataType!=undefined){ if($that.val().match(dataType)){ $that.removeClass("borderRed"); }else{ $that.addClass("borderRed"); } } }) $(document).on("focus","input",function(){ $(this).removeClass("borderRed"); });
以上内容给大家分享了jquery+正则实现统一的表单验证,希望大家喜欢。
这篇关于jquery+正则实现统一的表单验证的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-03-06jquery对css样式(jquery中的css方法)-icode9专业技术文章分享
- 2023-05-27JQuery的认识和安装
- 2023-01-06JQuery应用技巧:如何定义 HTML 模板并使用 JQuery 进行加载-icode9专业技术文章分享
- 2022-09-29复习-jQuery
- 2022-09-04Python3项目初始化10-->前端基础jquery、ajax,sweetalert--更新用户改造
- 2022-08-30day 27 jquery
- 2022-08-29jQuery筛选器,bootstrap
- 2022-08-20JQuery事件绑定
- 2022-08-20JQuery案例
- 2022-08-07关于jQuery的学习