新增了input元素的种类

  • search:搜索输入框
  • tel:电话号码输入框
  • url:输入url地址
  • email:邮箱输入框
  • number:数字输入框
  • rang:特别范围内的数值选择器(通过拖动滚动条改变一定范围内的数字)
  • color:颜色选择器只在opera和blackberry浏览器
  • datetime:显示完整日期和时间UTC标准时间
  • datetime-local:显示完整日期和时间
  • time:显示时间
  • month:显示月
  • week:显示周
  1. <form action="">
  2. <input type="email" name="email" />
  3. <input type="submit" value="提交">
  4. </form>

表单新特性

placeholder

  • 输入框占位符,常用作输入提示,在光标聚焦时,占位符自动消失
  • autpcpmplete:是否保存用户输入值
    • 默认为on,关闭提示选择off
  • autofocus:自动聚焦
  • required:此项必填,不能为空
  • pattern:正则校验 pattern=”\d{1,5}”
  • form属性只要加上form属性,表单元素可以放在页面的任务位置
  • formnovalidate和novalidate
    • 它两都表示不需要验证表单,直接提交,novalidate用户html标签;
    • formnovalidate用于submit类型的提交按钮

表单验证

validity对象,通过下面的valid可以查看验证通过

  • oText.addEventListener(“invalid”,fn1,false);
  • valid:验证不要通过时返回false
  • valueMissing:输入值为空时
  • typeMismatch:控件值与预期类型不匹配
  • patternMismatch:输入值不足pattern正则
  • customError不符合自定义验证
    • setCustomValidity();自定义验证