当我们在做前端开发时，常常需要对用户输入的数据进行校验。为了提高开发效率，我们可以使用现成的校验库，这里介绍一款常用的库——validation.min.js。
安装
通过 npm 安装：
npm install validation
或者直接在 HTML 中引入：
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.3/jquery.validate.min.js"></script>
基本使用
配置规则
在 JavaScript 中配置校验规则：
$("#form").validate({
rules: {
field: {
required: true,
minlength: 5
}
}
});上述代码表示 “form” 中的 “field” 字段必须填写且长度不少于 5。
校验方法
在 HTML 中使用校验方法：
<form id="myform"> <input type="text" name="field" required minlength="5"> <input type="submit"> </form>
上述代码表示 “myform” 中的 “field” 字段必须填写且长度不少于 5。
高级用法
自定义错误信息
在 JavaScript 中配置错误消息：
-- -------------------- ---- -------
---------------------
------ -
------ -
--------- -----
---------- -
-
--
--------- -
------ -
--------- ----------
---------- ------------
-
-
---自定义校验方法
在 JavaScript 中定义新的校验方法：
$.validator.addMethod(
"regex",
function(value, element, regexp) {
return this.optional(element) || regexp.test(value);
},
"输入格式不正确"
);上述代码定义了一个新的校验方法 “regex”，传入参数为正则表达式 “regexp”，如果输入的值与正则表达式匹配则校验成功。
在 HTML 中使用自定义校验方法：
<form id="myform"> <input type="text" name="field" regex="/^[0-9]+$/"> <input type="submit"> </form>
上述代码表示 “myform” 中的 “field” 字段必须为数字。
总结
使用 validation.min.js 可以极大地提高前端开发效率，实现字段校验的同时还可以自定义错误消息和校验方法，使代码更加灵活和易于维护。希望本文对读者有所帮助，欢迎体验和尝试。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066bce967216659e244ce0