前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >【JQuery】JQuery入门——JQuery 插件-validation

【JQuery】JQuery入门——JQuery 插件-validation

作者头像
陶然同学
发布2023-02-27 12:41:52
12.3K0
发布2023-02-27 12:41:52
举报
文章被收录于专栏:陶然同学博客

👀专栏介绍

【JQuery】 目前主要更新JQuery,一起学习一起进步。

👀本期介绍

本期主要介绍JQuery入门——知识点讲解(四)

文章目录

1. 插件简述

2. 插件导入

3. 为指定表单加入校验

4. 为校验加入规则

5. 为规则自定义错误信息

6. 为错误信息自定义显示位置(扩展-了解)

7. 自定义校验规则(扩展)

1. 插件简述

JQuery 有着大量的功能插件,每种插件都有自己独有的功能。

例如:

表单校验 ----validation

移动互联网开发 ----BootStrap

Ajax 数据展示 -------EasyUI

今天我们学习其表单校验插件 ---- validation

2. 插件导入

validate 是 jQuery 插件,及必须在 jQuery 的基础上进行运行。我们将导入 jQuery 库、 validate

库、和国际

化资源库(可选,建议导入)

准备代码:

3. 为指定表单加入校验

validate 需要手动的声明,对那个表单进行校验,及需要手动调用 validate()方法。

4. 为校验加入规则

validate()方法中可以指定添加规则

规则速查表

注意:为了方便展示,请设置如下样式:

5. 为规则自定义错误信息

messages 可以为已经定好的规则自定义错误信息

其中

{0} 动态获取规则值的第一个值

{1} 动态获取规则值的第二个值

6. 为错误信息自定义显示位置(扩展-了解)

格式:

<form>

<label class="error" for=" 被添加规则的表单输入项 name" ></label>

……

</form>

例如,表单中的生日 birthday ,已经被添加规则。

<form>

<label class="error" for="birthday"></label>

……

</form>

7. 自定义校验规则(扩展)

如果希望自定义校验规则,需要使用$.validator.addMethod 完成。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022-08-04,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 👀专栏介绍
  • 👀本期介绍
  • 文章目录
  • 1. 插件简述
  • 2. 插件导入
  • 3. 为指定表单加入校验
  • 4. 为校验加入规则
  • 5. 为规则自定义错误信息
  • 6. 为错误信息自定义显示位置(扩展-了解)
  • 7. 自定义校验规则(扩展)
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档