众所周知 前端表单验证是个很普通的功能 以往验证是通过正则和各种插件完成 现在可以直接用h5为我们提供的便利写法去完成了 写法如下

1
2
3
4
5
6
<form action="text.php" method="get"> 
   邮箱地址:

   <input type="email" name=""> 
   <input type="submit" >
 </form>

如果不希望校验的话 可以在 form 里面 加入novalidate属性

常用类型和用法

1
2
3
4
5
6
7
8
9
10
11
<input type="email">

email    邮箱地址
url      网址
number   数字
range    滑块s
color    拾色器s
date     显示日期
month    显示月份
week     显示礼拜
time     显示时间

表单提交完后双击输入框会显示最近填写的东西

优点是方便查看 缺点是别人如果用了你的电脑也会看到

如果不希望显示的话 可以这样写 默认是打开的

1
<form action="text.php" method="get" autocomplete="off">

表单属性

1
2
3
4
5
6
7
8
9
10
11
12
autofocus      自动获取焦点
placeholder    占位符
required       必填
form           可以提交form标签以外的input 如果input不得不放在外面 同时点form内的submit还想提交的话 可以在外面的input加入form属性 值就是form的id
multiple       一般用于select  可以多选
list           input里加list属性 值是datalist的id  如

<input list="abc">
<datalist id="abc">
  <option value="123"></option>
  <option value="234“></option>
</datalist>