HTML的表单控件

1. Text

<input type="text" /> 定义用户可输入文本的单行输入字段。

Email: <input type="text" name="email" />
Pin: <input type="text" name="pin" />

TIY

 

2. Button

<input type="button" /> 定义可点击的按钮，但没有任何行为。button 类型常用于在用户点击按钮时启动 JavaScript 程序。

<input type="button" value="Click me" οnclick="msg()" />

TIY

3. Submit

<input type="submit" /> 定义提交按钮。提交按钮用于向服务器发送表单数据。数据会发送到表单的 action 属性中指定的页面。

<form action="form_action.asp" method="get">
Email: <input type="text" name="email" />
<input type="submit" />
</form>

TIY

4. Checkbox

<input type="checkbox" /> 定义复选框。复选框允许用户在一定数目的选择中选取一个或多个选项。

<input type="checkbox" name="vehicle" value="Bike" /> I have a bike
<input type="checkbox" name="vehicle" value="Car" /> I have a car

TIY

5. File

<input type="file" /> 用于文件上传。

<input type="file" />

TIY

6. Image

<input type="image" /> 定义图像形式的提交按钮。

必须把 src 属性 和 alt 属性 与 <input type="image"> 结合使用。

 

alt 属性只能与 <input type="image"> 配合使用。它为图像输入规定替代文本。

 

alt 属性为用户由于某些原因无法查看图像时提供了备选的信息。

注释：即使 alt 属性不是必需的属性，但是当输入类型为 image 时，仍然应该设置该属性。如果不使用该属性，就有可能对文本浏览器或非可视的浏览器造成使用障碍。

 

<input type="image" src="submit.gif" alt="Submit" />

TIY

 

7. Password

<input type="password" /> 定义密码字段。密码字段中的字符会被掩码（显示为星号或原点）。

<input type="password" name="pwd" />

TIY

 

8. Radio

<input type="radio" /> 定义单选按钮。单选按钮允许用户选取给定数目的选择中的一个选项。

<input type="radio" name="sex" value="male" /> Male
<input type="radio" name="sex" value="female" /> Female

TIY

 

9. Reset Button

<input type="reset" /> 定义重置按钮。重置按钮会清除表单中的所有数据。

<input type="reset" />

TIY

表单的动作属性（Action）和确认按钮

当用户单击确认按钮时，表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。

<form name="input" action="html_form_action.asp" method="get">
Username: 
<input type="text" name="user" />
<input type="submit" value="Submit" />
</form>

浏览器显示如下：

Username:     

假如您在上面的文本框内键入几个字母，然后点击确认按钮，那么输入数据会传送到 "html_form_action.asp" 的页面。该页面将显示出输入的结果。

表单标签

标签	描述
<form>	定义供用户输入的表单
<input>	定义输入域
<textarea>	定义文本域 (一个多行的输入控件)
<label>	定义一个控制的标签
<fieldset>	定义域
<legend>	定义域的标题
<select>	定义一个选择列表
<optgroup>	定义选项组
<option>	定义下拉列表中的选项
<button>	定义一个按钮