HTML+CSS+DIV网页设计与布局 作者 聂斌 第6章 表单.pptVIP

第6章 表单 在现实生活中，总会要填很多表，如入学申请表、健康体检表等等，如果把这些表格放在网上，就是HTML中的表单。表单是实现动态页面的一种主要外在形式，也就是说表单是进行用户和浏览器交互的重要手段。 在线教务辅导网： 教材其余课件及动画素材请查阅在线教务辅导网 QQ:349134187 或者直接输入下面地址： 6.1 添加表单 表单可以用来收集用户在客户端提交的各种信息，例如在网站登录或注册时进行的键盘和鼠标操作，都是通过表单作为载体传递给服务器的。表单其实是页面中的一个特定的区域，由FORM标记和/FORM标记定义，所有的表单元素都要在这对标记之间才有效。表单的基本语法如下所示： FORM 表单标记的各种属性设置 设置各种表单元素 /FORM 6.1.1 链接跳转 ACTION属性是用来设置链接跳转，也就是在提交表单的内容的时候，按照链接地址跳转到相应的页面进行处理。由于ACTION属性是用来控制整个表单的提交内容，所以ACTION属性要写在FORM标签里面。其语法结构如下所示： FORM ACTION=链接跳转的地址 设置各种表单元素 /FORM 6.1.1 链接跳转 例如以下代码，说明将表单提交到绝对路径“/s”下的默认网页下。 FORM NAME=myform ACTION=/s 以下代码说明将表单提交到绝对路径“/news/seacher.aspx”上，其中seacher.aspx文件是用于接收并处理表单的程序。 FORM ACTION=” /news/seacher.aspx” 以下代码说明将表单提交到相对路径“searcher.asp”上，其中searcher.asp文件是用于接收并处理表单的程序。 FORM ACTION=”seacher.asp” 6.1.2 链接跳转方式 设置了链接跳转ACTION以后，还需要设置当链接跳转时所使用的跳转方法。可以通过METHOD属性来进行设置，它决定了表单中已收集数据是用什么样的方法发送到服务器的。其语法结构如下所示： FORM METHOD=表单的链接跳转方法 表单元素 /FORM 表单的链接跳转方式一般可以设置为get和post两种，其具体含义如下表所示。 6.1.3 表单名称 表单名称标记主要是为了区分各个表单，因为有时候在一个页面中可能会有多个表单，或者在一个表单处理程序中需要处理多个页面的表单，这时候表单名称就显得尤其重要了。表单名称的标记是NAME，其语法是： FORM NAME=表单名称 表单元素 /FORM 6.2 输入标签 输入标签INPUT是使用最广泛的表单控件元素，用于定义输入域的开始。INPUT标签是单标签，所以在使用时，要为INPUT标签加上“/”号，来达到标签的闭合。INPUT标签必须嵌套在表单标记中使用。其语法结构如下所示： FORM INPUT TYPE= / /FORM 6.2.1 文本框 文本框就是用来在输入框中输入任何类型的数字、文本以及字母等，输入的内容单行显示在页面中，可以通过TYPE=text来进行设置。其语法如下所示： FORM INPUT TYPE=text /FORM 6.2.2 密码框 密码输入框是用来输入密码的，可以通过TYPE=password来进行设置。设置以后，在密码输入框中输入的内容就会变成小黑点或者是“*”号，可以用来保护密码不被第三者看见。其语法结构如下所示： FORM INPUT TYPE=password /FORM 6.2.3 单选框 单选框是指只能选择其中一项的选项框，就像很多表单中的“性别”选项一样，要么是男，要么是女，不可能同时是男又是女。因此，可以将性别这一单元中设置成为单选框，让用户选择，选中的选项会以圆点显示。单选框可以通过TYPE=radio来进行设置，其语法如下所示： FORM INPUT TYPE=radio NAME=名称 /FORM 6.2.4 复选框 复选框与单选框类似，可以是一个单独的复选框，也可以是多个复选框组成的复选框组。复选框可以让用户同时在表单中选择或取消多个选择项目，在浏览器中通常表现为一个小方框，当用户选中复选框时，会在小方框里打上一个勾。如果用户没有选中该选项或取消该复选框时，小方框里为空。复选框可以通过TYPE=checkbox来进行设置，其语法如下所示： FORM INPUT TYPE=checkbox NAME=名称 /FORM 6.2.5 提交按钮 提交按钮是把表单里的信息提交到指定的数据库或者其他地方。可以通过TYPE=submit来进行设置，其语法结构如下所示： FORM INPU