HTML5引入了几个以验证的表单组件,可以在表单提交前对数据进行验证。
这个几个表单组件是:
组件名 | 形式 |
日期 | <input type="date" > |
邮件 | <input type="email"> |
URL | <input type="url"> |
搜索 | <input type="search"> |
示例:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
<!DOCTYPE html> < html > < head > < title >HTML5表单</ title > < meta charset = "UTF-8" > < meta name = "viewport" content = "width=device-width, initial-scale=1.0" > </ head > < body > < label for = "birthday" >生日:</ label > < input name = "birthday" type = "date" id = "birthday" >< br >< br > < label for = "email" >邮箱:</ label > < input name = "email" type = "email" id = "email" >< br >< br > < label for = "mysite" >个人网站:</ label > < input name = "mysite" type = "url" id = "mysite" >< br >< br > < label for = "searchMysite" >网站内搜索:</ label > < input name = "text" type = "search" id = "searchMysite" >< br > < input type = "submit" value = "提交" > </ form > </ body > </ html > |