js表单验证，多字段长度校验

在开发中，有时会遇到几十或一百多甚至更多的字段都需要做长度校验。我们不可能一个字段一个字段的去写，然后我发现input中有maxLength属性可以做到类似的，但是问题是中文字符占2个长度，使用maxLength就不符合条件了。只能通过js来校验了，但是如果字段比较多的话校验起来比较麻烦。所以记录一下解决方法。

HTML部分代码

<td align="right"><label class="Validform_label">编号:</label>
</td>
<td class="value"><input id="num" name="num" type="text" style="width: 150px" class="inputxt" maxLength="50"><span class="Validform_checktip"></span><label class="Validform_label" style="display: none;">编号</label>
</td>

js表单提交前验证代码

function checkSubmit(){var inps =$("#formobj").find("input");for(var i=0;i<inps.length;i++){if(inps[i].type=='text'){//替换中文为2个字符var len = inps[i].value.replace(/[\u4E00-\u9FA5]/g,'aa').length;//和设定的长度进行对比if(len>inps[i].maxLength){//超过就提示alert($(inps[i]).parent().find("label").html()+'不得超过'+inps[i].maxLength+'个字符（中文占2个字符）');return false;}}}return true;
}

输入框失去焦点事件

$("input[type='text']").each(function (index){$(this).blur(function(){var len = $(this).val().replace(/[\u4E00-\u9FA5]/g,'aa').length;if(len>$(this).attr("maxLength")){alert($(this).parent().find("label").html()+'不得超过'+$(this).attr("maxLength")+'个字符（中文占2个字符）');}});
});

如果有更好的方法也可以一起交流一下！

js表单验证，多字段长度校验相关推荐

js表单验证密码(确认密码)，密码长度至少8位，并且英文与数字组合
js表单验证密码(确认密码) 案例需求:在注册时,输入密码对其进行密码强度验证,并判断两次输入的密码是否一致.例如,密码长度至少8位,并且英文与数字组合. 代码实现 <p>输入密码:< ...
掌财社:html5中AmazeUI框架中JS表单验证实战案例展示！
今天和大家分享个有关于"html5中AmazeUI框架中JS表单验证实战案例展示!"这方面的相关内容知识,让大家对于html5中AmazeUI框架也可以有所了解! 1.需求做一个 ...
JS表单验证-12个常用的JS表单验证
JS表单验证-12个常用的JS表单验证表单验证,小编在项目完结后的这段时间把常用的JS表单验证demo整理了一下,和大家一起分享~~~ 1.长度限制 <p>1. 长度限制</p&g ...
通用的JS表单验证插件代码
一个通用的JS表单验证插件代码.使用方法:第一步:需设定表单项数据类型,第二步:实例表单验证,验证错误提示说明(程序有自带相关错误提示,可自定义每项验证错误提示时文本,只需添加msg). [task] ...
js表单验证（常用的正则表达式）
js表单验证的正则表达式,test() 方法用于检测一个字符串是否匹配某个模式,如果字符串中含有匹配的文本,则返回 true,否则返回 false. 语法:let reg=/正则表达式主体/修饰符(可 ...
anjular.js表单验证实例
应用声明,控制器 <form action="" method="post" id="myForm" name="logFo ...
JS表单验证(HTML+CSS+JS)详细教程
大家好,今天分享一个HTML+CSS+JS表单验证,这是我前两天学习的一个小demo,在这记录一下. 目录一.效果图二.介绍三.代码 (1)HTML (2)CSS (3)JavaScript J ...
分享21个JS抽奖转盘特效，36个JS表单验证，31个JS进度条，总有一款适合您
分享21个JS抽奖转盘特效,36个JS表单验证,31个JS进度条,总有一款适合您下载链接:https://pan.baidu.com/s/1TWOGqes5J2baelO9qdItXg?pwd=ma ...
js表单验证确认密码输入一致
<form action="../01-自动轮播图片/图片自动轮播.html" onsubmit="return checkForm()" >用户名 ...

js表单验证，多字段长度校验

js表单验证，多字段长度校验相关推荐

最新文章

热门文章