该楼层疑似违规已被系统折叠 隐藏此楼查看此楼
◆11、智能表单及表单验证反馈
input表单type属性值:
type = "email" 限制用户输入必须为Email类型
type="url"限制用户输入必须为URL类型
type="date" 限制用户输入必须为日期类型
type="datetime" 显示完整日期 含时区
type="datetime-local" 显示完整日期 不含时区
type="time" 限制用户输入必须为时间类型
type="month" 限制用户输入必须为月类型
type="week" 限制用户输入必须为周类型
type="number" 限制用户输入必须为数字类型
type="range" 生成一个滑动条
type="search" 具有搜索意义的表单results="n"属性
type="color" 生成一个颜色选择表单
type="tel" 显示电话号码
新增属性:
equired: required 内容不能为空
placeholder: 表单提示信息
autofocus:自动聚焦
pattern: 正则表达式 输入的内容必须匹配到指定正则范围
autocomplete:是否保存用户输入值默认为on,关闭提示选择 off
formaction: 在submit里定义提交地址
datalist: 输入框选择列表配合list使用 list值为datalist的id值
表单验证反馈:
Invalid事件 validity对象(valid查看验证是否通过)
input.addEventListener('invalid',fn,false)
阻止默认验证:ev.preventDefault()
formnovalidate属性 : 关闭验证
oText.addEventListener("invalid",fn1,false);
ev.preventDefault()
valueMissing : 输入值为空时
typeMismatch : 控件值与预期类型不匹配
patternMismatch : 输入值不满足pattern正则
customError 不符合自定义验证
setCustomValidity();
自定义验证
tooLong : 超过maxLength最大限制
rangeUnderflow : 验证的range最小值
rangeOverflow:验证的range最大值
stepMismatch: 验证range 的当前值 是否符合min、max及step的规则
output: 计算或脚本输出