H5表单

表单概述

表单的标记为<form>和</form>，主要负责采集浏览者的相关数据。

<form action="url" method="get|post" enctype="mime">
下面是输入用户登陆信息
<br/>
用户名称
<input type="text" name="user">
<br/>
用户密码
<input type="password" name="password">
<br/>
<input type="submit" name="登录">
</form>

其中action表示处理提交表单的格式，它可以是一个URL地址或一个电子邮件地址；method指明提交表单的HTTP方法。enctype指明用来把表单提交给服务器时的互联网媒体形式。

表单基本元素

text

文本框是一种让访问者自行输入内容的表单对象，通常被用来填写单个字或者简短的回答，如用户名和地址，一般格式：

<input type="text" name="yourname" size="20" maxlength="15" value="name">

其中name属性定义文本框的名称，必须独一无二；size属性定义文本框的宽度，单位是单个字符宽度；maxlength属性定义最多输入的字符数；value属性定义文本框的初始值。

多行文本框

多行文本框标记主要用于输入较长的文本信息，一般格式如下：

<textarea name="..." cols="..." rows="..." wrap="..."></textarea>

其中name属性定义文本框的名称，必须独一无二；cols属性定义文本框的宽度，单位是单个字符宽度；rows属性定义文本框的高度，单位是单个字符高度；wrap属性定义内容大于文本域时显示的方式。

密码域

密码输入框是一种特殊的文本域，主要用偶遇输入一些保密信息。当网页浏览者输入文本时，显示的是黑点或其它符号，一般格式如下：

<input type="password" name="..." size="..." maxlength="...">

其中name属性定义文本框的名称，必须独一无二；size属性定义文本框的宽度，单位是单个字符宽度；maxlength属性定义最多输入的字符数。

单选按钮radio

单选按钮主要是让网页浏览者在一组选项里选择起义，一般格式如下：

<input type="radio" name="..." value="...>

其中name属性定义文本框的名称,同一组中的单选按钮都必须用同一个名称；value属性定义单选按钮的值，同一组中它的域值必须不同。

复选框checkbox

复选框主要是让网页浏览者在一组选项里可以同时选择多个选项，一般格式入下：

<input type="checkbox" name="..." value="...">

其中name属性定义文本框的名称,同一组中的单选按钮都必须用同一个名称。

选择列表标记select

下拉选择框主要用于在有限的空间里设置多个选项，它即可以用作单选，也可以用作多选，一般格式如下：

<select name="..." size="..." multiple>
<option value="..." selected>
...
</option>
...
</select>

其中name属性定义文本框的名称,size属性定义选择列表的行数；multiple属性表示可以多选，如果不设置该属性，则只能单选；value属性定义选择项的值；selected属性表示默认已选择本项。

普通按钮buuton

普通按钮用来控制其它定了的脚本工作，一般格式如下：

<input type="button" name="..." value="..." onclick="..." />

其中name属性定义普通按钮的名称；value属性定义按钮的显示文字；onclick属性表示单击行为。

提交按钮submit

提交按钮用来将输入信息提交到服务器，一般格式如下：

<input type="submit" name="..." value="..." />

其中name属性定义普通按钮的名称；value属性定义按钮的显示文字。

重置按钮reset

重置按钮用来清空表单中输入的信息，一般格式如下：

<input type="reset" name="..." value="..." />

其中name属性定义普通按钮的名称；value属性定义按钮的显示文字。

表单高级元素

url属性

url属性用于说明网站网址，显示为一个文本框中输入一个url地址。在提交表单时会自动验证url的值，一般格式如下：

<input type="url" name="userurl" />

email属性

与url属性类似，email属性用于让浏览者输入E-mail地址。在提交表单时会自动验证email域的值，代码格式如下：

<input type="email" name="..." />

date和Times

属性	含义
date	选取日、月、年
month	选取月、年
week	选取周和年
time	选取时间
datetime	选取时间、日、月、年
datetime-local	选取时间、日、月、年(本地)

number属性

number属性提供了一个输入数字的输入类型。用户可以直接输入数字或者通过单击微调框中的按钮选择数字，一般代码如下：

<input type="number" name="shuzi" />

可以在属性中定义min属性和max属性的值。

range属性

range属性可以显示一个滚动的空间，可以使用max，min和step属性设置空间的范围，一般代码如下：

<input type="range" name="..." min="..." max="..." step="..." />

required属性

required属性规定必须在提交前填写输入域，一般代码如下：

<input type="text" name="user" required="required">

file属性

使用file属性实现文件上传框，一般代码如下：

<input type="file" name="..." size="..." maxlength="...">

其中name属性为文件上传框的名称，size属性定义文件上传框的宽度；maxlength属性定义最多输入字符数。