首页 > 代码库 > html--表单
html--表单
表单
表单的结构：
<form 属性="属性值">
控件
</form>
表单的属性：
1、name：表单的识别名称，一个页面有多处表单，通过表单的识别名称来辨认你提交的是哪个表单的数据
<form name="bill"></form>
<form name="game"></form>
2、action：表单数据传递到后端的路径
<form action="xxx.action"></form>
3、mehod：把表单数据提交到服务端的方式常见的两种get；post
get方法：默认的一种传递数据的方法，通过地址栏传递表单中的数据
特点：不能传递敏感数据例如：密码
不能传递大量数据，每次只能传递1024个字节
不能上传附件
post方法：不通过地址栏传递，直接传递到服务端
特点：相对安全
可以传递海量数据
可以上传附件
控件
1、单行文本框
<input type="text"/>
属性：name="名称" 文本框的识别名称（必须要有）
size="数值" 输入框的宽度，以字符为单位
maxlength="数值" 最多允许输入的字符数，如果超出范围则输入不进去
value="http://www.mamicode.com/内容" 输入框中的默认数据信息
2、密码框
<input type="password"/>
属性：name="名称" 密码框的识别名称（必须要有）
size="数值" 密码框的宽度，以字符为单位
maxlength="数值" 最多允许输入的字符数，如果超出范围则输入不进去
value="http://www.mamicode.com/内容" 密码框中的默认数据信息
readonly="readonly" 只读属性，只能选中不能修改
disabled="disabled" 禁止属性，不能选中不能修改
3、单选按钮
<input type="radio"/>
属性：name="名称" 单选按钮组的名称
value="http://www.mamicode.com/数据" 设置每一项单选的值（必须设置）
<input type="radio" name="sex" value="http://www.mamicode.com/1"/>男
<input type="radio" name="sex" value="http://www.mamicode.com/0"/>女
4、复选框
<input type="checkbox"/>
属性：name="名称" 多选按钮组的名称
value="http://www.mamicode.com/数据" 设置每一项的值（必须设置）
checked="checked" 默认勾选
5、多行文本框
<textarea></textarea>
属性：name 多行文本框的识别名称
value 不能出现value属性，如果想设置默认值格式如下<textarea>默认值</textarea>
rows 显示多少行内容
cols 显示一行显示多少个字符
6、下拉列表
<select>
<option>内容</option>
<option>内容</option>
<option>内容</option>
......
</select>
select属性
name 下拉列表的识别名称
option属性
value 代表每一项的初始值，默认值是option标签中的内容
7、隐藏域
<input type="hidden" name="名称"/>
隐藏域，不是给客户看而是给程序用的
8、文件域
<input type="file"/>
属性：name 文件域的名称
value 不写value，而是通过单击按钮来选择文件，选中的文件就是value
9、按钮
提交按钮<input type="submit" value="http://www.mamicode.com/按钮上的文字"/>提交数据
图片按钮<input type="image" src="http://www.mamicode.com/图片的路径"/>属于提交按钮的一种
重置按钮<input type="reset" value="http://www.mamicode.com/按钮上的文字"/>恢复到默认设置的状态
普通按钮<input type="button" value="http://www.mamicode.com/按钮上的文字"/>本身没有功能，需要结合程序构成功能
html--表单