今天就跟大家聊聊有关HTML5表单验证的特性是什么,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。
html5表单新增的类型:
url
range
number
date(date, month, week, time, datetime, datetime-local)
search
color
tel
去掉chrome记住密码后自动填充表单的黄色背景:
autocomplete="off" 可以加在input或者form上
下拉提示:
list 和 datalist
html5表单使用正则:pattern
提交表单时不进行验证:novalidate(加在form上) formnovalidate(加在input:submit上)
文本框自动聚焦:autofocus
如果input中有文件提示file,则form必须添加:
enctype="multipart/form-data"
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>form</title> </head> <body> <form action="" enctype="multipart/form-data" novalidate> <input type="file"> <!-- 正则:5个数字+cyy中任意一个字母 --> <input type="text" required autocomplete autofocus pattern="/^\d{5}[cyy]$/"> <input type="text" list="mylist"> <datalist id="mylist"> <option value="list1">list1</option> <option value="list2">list2</option> <option value="list3">list3</option> </datalist> <input type="submit" value="提交" formnovalidate> </form> </body> </html>
label for 在radio或者checkbox中比较明显(对应的是input的id)
效果就是选中label时,对应的radio或者checkbox就会被选中
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>form</title> </head> <body> <form action="" enctype="multipart/form-data" novalidate> <label for="man">男</label> <input type="radio" name="sex" id="man"> <label for="woman">女</label> <input type="radio" name="sex" id="woman"> <input type="submit" value="提交" formnovalidate> </form> </body> </html>
看完上述内容,你们对HTML5表单验证的特性是什么有进一步的了解吗?如果还想了解更多知识或者相关内容,请关注创新互联行业资讯频道,感谢大家的支持。
标题名称:HTML5表单验证的特性是什么-创新互联
文章出自:https://www.cdcxhl.com/article14/picde.html
成都网站建设公司_创新互联,为您提供响应式网站、定制网站、外贸建站、关键词优化、网站制作、建站公司
声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联