章节
问答
课签
笔记
评论
占位
占位

表单验证插件——validate

该插件自带包含必填、数字、URL在内容的验证规则,即时显示异常信息,此外,还允许自定义验证规则,插件调用方法如下:

$(form).validate({options})

其中form参数表示表单元素名称,options参数表示调用方法时的配置对象,所有的验证规则和异常信息显示的位置都在该对象中进行设置。

例如,当点击表单中的“提交”按钮时,调用validate插件验证用户名输入是否符合规则,并将异常信息显示在页面中,如下图所示:

在浏览器中显示的效果:

从图中可以看出,在页面中导入了validate插件,当用户在输入框中录入用户名时,自动根据规则进入验证,并显示提示信息,验证成功后,表单才能提交。

任务

我来试试,亲自使用validate插件,完成对邮件格式的验证。

在下列代码的第33、34、35行中,通过插件的配置对象,验证邮件格式。

?不会了怎么办
  1. 在配置对象中,首先,获取邮件元素名称作为声明目标,然后,将元素的required值设为true,表示不能为空,email值设为 true,表示为邮件格式。
  2. “required”和“email”属性值只接收布尔类型的值。
||
1
<!DOCTYPE html
    PUBLIC "
    -//W3C//DTD
    XHTML 1.0
    Transitiona
    l//EN"
    "http://www
    .w3.org/TR
    /xhtml1/DTD
    /xhtml1
    -transition
    al.dtd">
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
#divtest
{
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
提交
重置代码
||

请验证,完成请求

由于请求次数过多,请先验证,完成再次请求

加群二维码

打开微信扫码自动绑定

您还未绑定服务号

绑定后可得到

  • · 粉丝专属优惠福利
  • · 大咖直播交流干货
  • · 课程更新,问题答复提醒
  • · 账号支付安全提醒

收藏课程后,能更快找到我哦~

使用 Ctrl+D 可将课程添加到书签

邀请您关注公众号
关注后,及时获悉本课程动态

举报

0/150
提交
取消
全部 精华 我要发布

最新回答 / 慕梦前来
你这个用一个比较好的编辑器开发呀,直接就报出来了

最新回答 / 好吃的蛋包饭
你自己在jQuery官网上下载一个源代码就好了,自定义规则只要写到js文件里面都可以用。看不懂你想表达什么

最新回答 / 十指狂魔
HTML部分,将头部的js引用改为下面这样:<...code...>js部分改为下面这样:<...code...>

最新回答 / 慕后端3860619
我的理解是rules对应插件中的动作不可以随便写,email是要检测的的name值,对应 input中的name="email"。如果input中的name值变化,下面的email可以跟着变化。

最新回答 / make码客
这..........

最新回答 / 慕妹6610264
错误提示不是像你这样写的,head部分已经有链接引用进来了。

最新回答 / Taehong
那应该怎么验证没有错误

最新回答 / 慕粉1237465777
第一:必输项写错repuired:true,正确应该是, required:true,最好在编辑器中写会有提示,第二:初始化函数、校验函数都应该有分号,虽然JS默认会给你加上,但是最好写上经验。

最赞回答 / 自由的气息
不会啊,我没遇到.

已采纳回答 / 钱钱钱钱钱钱钱钱钱钱钱钱钱钱钱钱钱钱
看这网址就知道是慕课老师放到网上的,只要它还在就可以直接用,也可以存到本地用

最新回答 / 慕数据0258120
没看懂什么啊?

已采纳回答 / 肖炎
required就是这个框必须填写,email就是这个款输入的验证必须死邮件 如必须有@,可以参考html5表单type新类型
全部 我要发布
最热 最新
只看我的

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

账号登录 验证码登录

遇到问题
忘记密码

代码语言