介绍
jquery-validate是一款基于jQuery的表单验证插件，可以轻松地实现对表单输入数据的校验，使得前端开发更加便捷、高效。
安装
要使用jquery-validate，首先需要在项目中安装它。可以通过npm在命令行中进行安装：
npm install jquery-validation
然后，在HTML文件中引入相关文件：
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script src="./node_modules/jquery-validation/dist/jquery.validate.min.js"></script>
使用
- 初始化
在jQuery代码中，使用validate()方法对表单进行初始化：
$(document).ready(function() {
$("#myform").validate();
});其中，"myform"为表单的ID。
- 校验规则
jquery-validate支持多种校验规则，例如必填项、邮箱格式、手机号码格式等等。可以通过rules方法来设置校验规则：
-- -------------------- ---- -------
---------------------------- -
-----------------------
------ -
--------- -----------
------ -
--------- -----
------ ----
--
--------- -
--------- -----
---------- -
--
----------------- -
--------- -----
---------- --
-------- -----------
-
-
---
---上述代码中，设置了四个校验规则：
- username为必填项
- email为必填项，且必须是正确的邮箱格式
- password为必填项，且长度不能少于6个字符
- confirm_password为必填项，且长度不能少于6个字符，且和password输入内容相同
- 校验消息
校验完毕后，可以通过messages方法设置提示信息：
-- -------------------- ---- -------
---------------------------- -
-----------------------
------ -
--------- -----------
------ -
--------- -----
------ ----
--
--------- -
--------- -----
---------- -
--
----------------- -
--------- -----
---------- --
-------- -----------
-
--
--------- -
--------- ---------
------ -------------
--------- -
--------- --------
---------- --------------
--
----------------- -
--------- ----------
---------- ---------------
-------- ------------
-
-
---
---- 自定义校验规则
如果默认提供的校验规则无法满足需求，可以使用addMethod方法添加自定义的校验规则：
-- -------------------- ---- -------
---------------------------- -
------------------------------- --------------- -------- -
--- --------- - ------------
------ ---------------------- -- ------------------------
-- --------------
-----------------------
------ -
------- -
--------- -----
------- ----
-
--
--------- -
------- -
--------- ----------
------- ------------
-
-
---
---上述代码中，添加了一个名为"mobile"的自定义校验规则，判断用户输入是否为正确的手机号码格式。
示例代码
以下是一个简单的表单示例代码：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
----------------------------------
------- -----------------------------------------------------------
------- ----------------------------------------------------------------------------
--------
---------------------------- -
------------------------------- --------------- -------- -
--- --------- - ------------
------ ---------------------- -- ------------------------
-- --------------
-----------------------
------
- ----------------------------------------------------------- --------
----------------------------------------------------------------------------------