前言:关于本章节的内容,并非全部是个人原创,只是在学习中的总结笔记。难免有与其他学习网站或者博客相同之处,如有类同,各位大神莫怪!!!此资料只是用来学习和工作的参考,并不作为商业用途。希望与大家一起分享,共同进步!!!
第八章:表单
表单主要用来收集客户端提供的信息,使网页具有交互功能。
例如:会员注册,网上查询和搜索等。
1.<form>...</form>
<form></form>定义表单的开始位置和结束位置,表单提交时的内容就是<form>表单中的内容。
(1)基本格式
<form action="服务器端地址" name="表单名称"method="post|get"
enctype=”表单的资料的编码方式” target=”目标窗口的打开方式”>...</form>
(2)常用属性:
action:表单数据的处理程序的URL地址,如果为空则使用当前文档的URL地址,如果表单中不需要使用action属性也要指定其属性
为”no“。
name:表单名字。
method:传送数据的方式,分为post和get两种方式。
get方式提交时,会将表单的内容附加在URL地址的后面,所以限制了提交的内容的长度,不超过8192个字符,且不具备保密性。
post方式提交时,将表单中的数据一并包含在表单主体中,一起传送到服务器中处理,没有数据大小限制。
enctype:设置表单的资料的编码方式。
target:指定目标窗口的打开的方式。用来显示表单的返回信息。
-self:在当前页面中打开
-blank:在一个全新的空白窗口中打开
-top:在整个浏览器窗口中载入所链接的文件,因而会删除所有的框架。
-parent:在当前框架的上一层里打开
2.插入表单对象
(1)文字字段text
语法格式:<inputtype="text" name="定义控件的名称" value="文本框中的默认值"
size="控件的长度" maxlength="输入框中最大允许输入的字符数" />
(2)密码域password
语法格式:
<inputtype="password" name="定义控件的名称" value="密码域的默认值"
size="控件的长度" maxlength="输入框中最大允许输入的字符数" />
(3)单选按钮radio
小而圆的按钮。可以使用户从选择列表中选择一个选项。
语法格式:<inputtype="radio" name="定义按钮的名称" value="按钮的取值" checked />
注意:使用”cheked“属性来设置默认选中项。
(4)复选框checkbox
可以让用户从一个选项列表中选择多个选项。
语法格式:inputtype="checkbox" name="定义复选框的名称" value="复选框的取值" checked />
注意:使用”cheked“属性来设置默认选中项。
例如:
运行效果:
(5)普通按钮button
语法格式:<inputtype="button" name="按钮名称" value="按钮的取值" onclink=”处理程序” />
说明:value的取值就是显示在该按钮上的文字
(6)提交按钮submit
语法格式:<inputtype="submit" name="按钮名称" value="按钮的取值" />
(7)重置按钮reset
语法格式:<inputtype="reset" name="按钮名称" value="按钮的取值" />
说明:value的取值就是显示在该按钮上的文字
(8)图像域image
还可以使用一副图像作为按钮。
语法格式:<input name=”图像域名称” type=”image”src=”图像路径” />
(9)隐藏域hidden
当传送一些数据时,这些数据对于用户来说是不可见的。
语法格式:<input name=”隐藏域名称” type=”hidden”value=”隐藏域的取值” />
(10)文件域
文件域在上传文件时用到,用于查找磁盘的中的文件路径,然后通过表单将选中的文件上传。
语法格式:<input name=”文件域名字” type=”file”size=”控件的长度”maxlength=”最长字符数” />
3.菜单和列表
(1)下拉菜单
语法格式:
(2)属性说明:
multiple:multiple属性不用赋值,其作用是,表示用可以多选的下来列表,如果没有这个属性就只能单选。
size:设置列表的高度。
name:定义控件列表的名称。
option:<option>标记用来指定列表中的一个选项,需要放在<select></select>之间。
value:给选项赋值,指定传送到服务器上面的值。
selected:指定默认的选项。
例如:
4.文本域标记textarea
语法格式:<textarea name="name"rows="行数"cols="列数"value="初始默认值"> ... ... </textarea>
5.id标签
用于标示一个唯一的元素。
语法格式:<id=元素的标示名>
6.表单实例
运行结果: