HTML5自学笔记[ 3 ]表单验证反馈

表单控件对象的validity对象可以设置或返回相关的验证信息(在invalid事件处理中获取validity对象):

  1. 属性valid:为true所有验证通过,为False至少有一种验证失败。
  2. 属性valueMissing:表单控件输入值为空时,该属性值为true;不为空时该属性值为false。
  3. 属性typeMismatch:输入的内容不符合控件类型要求时,该属性为true,否则为false。
  4. 属性patternMismatch:输入的内容不匹配正则表达式时,该属性为true,否则为false。
  5. 属性tooLong:输入的内容超出了预设的最大长度时,该属性为true,否则为false。
  6. 属性rangeUnderflow:验证的值小于预设的最小值;实际操作中无法将值设置得比最小值小,因此该属性并没有什么卵用。
  7. 属性rangeOverflow:同rangeUnderflow,也并没有什么卵用。
  8. 属性stepMismatch:验证range的当前值是否是前当前值与step的和;也没什么卵用。
  9. 方法setCustomValidity():自定义验证,参数是提示信息。
  10. 属性customError:验证自定义验证,不符合为true,否则为false。
时间: 2024-10-27 09:49:59

HTML5自学笔记[ 3 ]表单验证反馈的相关文章

AngularJS学习笔记(二) 表单验证案例(ng-repeat/filter)

这一节相对来说需要理解的东西不是太多,记住了那些api就行了. 还是一个案例(同样来自miaov),一个表单验证,先上代码,然后再对对应的内容进行解释. <!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> <meta charset="UTF-8"> <title>Title</title> </head>

HTML5的表单验证实例

HTML5新增加的表单验证可以大大减少你对JavaScript代码的依赖,并且进行丰富的客户端校验,下面提供两个例子. 1.HTML5客户端校验:checkValidity方法 checkValidity方法可以用于检验你的输入是否合法,合法时返回true,否则返回false. <!doctype html> <html> <head> <meta charset="utf-8"> <title>HTML5客户端校验:chec

Html5之高级-3 HTML5表单验证(验证属性、验证状态)

一.验证属性 Required 属性 - Required 属性主要防止域为空时提交表单.该属性不需要设置任何值 - 语法: Pattern 属性 - Pattern 属性的作用是实现元素的验证.它支持使用正则表达式定制验证规则 - 语法: Min 和 Max 属性 - min.max和step属性用于为包含数字或日期的input类型规定限定(约束) - 语法: Minlength 和 Maxlength 属性 - Minlength 和 Maxlength 属性的作用是定制元素允许的最小字符数

纯H5+c3实现表单验证

客户端验证是网页客户端程序最常用的功能之一,我们之前使用了各种各样的js库来进行表单的验证.HTML5其实早已为我们提供了表单验证的功能.至于为啥没有流行起来估计是兼容性的问题还有就是样式太丑陋了吧. 下面我们将来一步一步创造一个HTML5和CSS3的表单验证,只使用HTML和CSS. 完成后的如下: 第一步:整理验证字段和类型 首先我们需要如下几个字段: 姓名(full name) 电话号码(phone number) 邮箱地址(email address) 网址(website) 在用户输入

Codeigniter入门学习笔记14—表单的验证

很久很久以前学习Codeigniter的笔记记录,很随意,但都是自己记录的,希望对需要的人有所帮助. 本文使用word2013编辑并发布 Postbird | There I am , in the world more exciting! Postbird personal website : http://www.ptbird.cn 表单验证 1.add_user ????] 2.form_check() ???? 3. ? 1.加载 ????$this->load->library('f

实现跨浏览器html5表单验证

div:nth-of-type(odd){ float: left; clear: left; } .origin-effect > div:nth-of-type(even){ float: right; clear: right; } .clearfix:after{ content: ""; display:block; clear: both; } .figcaption{ clear: both; color: #999; padding-top: 10px; text

html5 自带表单验证怎么禁用

HTML5加强了表单验证功能,可验证是否可空及输入内容的类型及格式,并可通过为表单或控件设置 novalidate 属性指定在提交表单时不验证整个 form 或指定的input. 例: ENDINPUT验证INPUT 标签中通过 type属性指定输入内容类型:email,指定输入内容为电子邮件地址.url,指定输入内容为URL.number,指定输入内容为数字,并可通过 min.max.step 属性指定最大最小及间隔.date.month.week.time.datetime.datetime

HTML5 web Form表单验证实例

HTML5 web Form 的开发实例! index.html 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>HTML5表单验证</title> 6 <link rel="stylesheet" type="text/css" href="../css/style.

JavaScript 笔记(2) -- 类型转换 &amp; 正则表达 &amp; 变量提升 &amp; 表单验证

目录:  typeof, null, undefined, valueOf() 类型转换 正则表达式 错误: try, catch, throw 调试工具 变量提升 strict 严格模式 使用误区 表单 & 表单验证 JavaScript void typeof, null, undefined, valueOf() typeof:用于检测变量的数据类型,eg: typeof "John"; // 返回 string 在 JavaScript 中有 5 种不同的数据类型:st