HTML表单 -- 如何使用HTML表单

HTML 表单用于收集用户输入,向服务器传输数据,使用

元素来定义一个HTML表单。
表单可以包含 input, label, menus, textarea, filedset 和 legend 元素。
下面简单介绍这些表单中常见元素的用法。

1. form 元素

常用属性:
action:提交表单的地址
method:提交表单使用的方法,一般有get和post两种,具体区别见 HTML表单 -- 相关概念



2. input 元素

input 元素通过 type 属性来设置不同的input 类型。

2.1 文本域

效果:

其中 placeholder 属性可以设置在控件未获得焦点时显示的提示信息,而在获得焦点时提示消失。

2.2 密码域

效果:

密码域的输入框会对输入信息做掩码处理。

2.3 复选框

dota 旅游 宠物

效果:

name 属性为相同的复选框元素会被分到同一个分组。复选框的 value 值是必须有的,否则后台接收到数据无法识别究竟勾选了什么值。可以对 input 标签增加 checked 属性实现预选。

2.4 单选按钮

效果:

单选按钮和复选框一样,通过相同的name 属性值来识别同一组按钮,value 属性是必需的。可以对 input 标签增加 checked 属性实现预选。

2.5 下拉列表

效果:


option 的 value 属性是必需的,可以对 option 设置 selected 属性实现预选择。

2.6 提交按钮


效果:

2.7 隐藏字段


隐藏字段对于用户是不可见的。

2.8 重置按钮


效果:

重置按钮可以清空表单中填写的所有内容。

2.9 打开文件


效果:

3. label 元素

在介绍 input 元素时,label 元素已出现多次,例如:

label 元素为 input 元素定义标注,当鼠标选择该标签时,关联的元素控件会获得焦点,for 属性与关联元素的 id 属性要相同。

4. textarea 元素


效果

你可能感兴趣的:(HTML表单 -- 如何使用HTML表单)