HTML表单是一个包含表单元素的区域,用来收集用户输入的内容并提交。
表单元素通常包括文本域(textarea)、单选框(radio-buttons)、复选框(checkboxes)等。
form
表单使用标签<form>来设置
<form>的常用属性
action :表单提交的地址,这个值可以被 <button> 或者 <input> 元素中的 formaction: 属性重载(覆盖)。
method:提交表单的方法,有get和post两种。
- post: 指的是 HTTP POST 方法 ; 表单数据会包含在表单体内然后发送给服务器.
- get: 指的是 HTTP GET 方法; 表单数据会附加在 URI action 属性中并以 '?' 作为分隔符, 然后这样得到的 URI 再发送给服务器. 当这样做(数据暴露在URI里面)没什么副作用,或者表单仅包含ASCII字符时,再使用这种方法吧。
<form action="/getInfo" method="get">
</form>
input
用的最多是输入标签input,有类型属性type来决定输入类型。常见的输入类型如下:
<input type="text"> 单行文本输入框
<input type="password"> 密码输入框
<input type="checkbox"> 多选框
<input type="radio"> 单选框 通过name属性值来进行分组
<input type="file"> 可以让用户选择文件。使用 accept 属性可以定义控件可以选择的文件类型。
<input type="submit "> 用于提交表单的按钮
<input type="number "> 用于输入浮点数的控件
<input type="hidden "> 不显示在页面上的控件,但它的值会被提交到服务器
<input type="button "> 无缺省行为按钮
除了input外还有一些其他的表单输入元素
textarea
多行文本域
<textarea rows="10" cols="30">
我是多行文本输入框
</textarea>
select 、option
下拉列表
<select name="city">
<option value="shanghai">上海</option>
<option value="shenzhen">深圳</option>
<option value="beijing">北京</option>
</select>
label
这个标签主要是为input元素定义标注(标记)。
<label for="male">Male</label>
<input type="radio" name="sex" value="male"><br />
<label for="male">Female</label>
<input type="radio" name="sex" value="female">