HTML+CSS+Javascript网站制作案例教程第6章 表单标签设置.pptVIP

6.1.1　网页表单的作用 表单不是表格，既不用来显示数据，也不用来布局网页。表单提供一个界面，一个入口，便于用户把数据提交给后台程序进行处理。 网页中的from/form标签用来创建表单，定义了表单的开始和结束位置，在标签之间的内容都在一个表单当中。表单子元素的作用是提供不同类型的容器，记录用户的数据。 用户完成表单数据输入之后，表单将把数据提交到后台程序页面。页面中可以有多个表单，但要确保一个表单只能提交一次数据。 6.1.2　网页表单form标签 网页中的form/form标签用来插入一个表单，在表单中可以插入相应的表单元素。用户完成表单数据输入之后，表单将把数据提交到后台程序页面。页面中可以有多个表单，但要确保一个表单只能提交一次数据。 在表单的form标签中，可以设置表单的基本属性，包括表单的名称、处理程序和传送方法等。 6.1.3　表单的数据传递方式method属性 表单的method属性用于指定在数据提交到服务器时使用哪种HTTP提交方法，其值有两种，get和post。默认是get方法，而post是最常用的方法。 只有一个表单是无法实现其功能的，表单标签只有和他所包含的具体表单元素相结合才能真正实现表单收集信息的功能。属于表单内部的元素比较多，适用于不同类型的数据记录。大部分的表单元素都采用单标签input，不同的表单元素input标签的type属性取值不同。 6.2.1　文本域text 文本域又称为单行文本框，属于表单中使用比较频繁的表单元素，在网页中很常见。 课堂案例——插入文本域 课堂案例：插入文本域 最终文件：光盘\最终文件\第6章\6-2-1.html 视频：光盘\视频\第6章\6-2-1.swf 课堂案例——插入密码域 课堂案例：插入密码域 最终文件：光盘\最终文件\第6章\6-2-2.html 视频：光盘\视频\第6章\6-2-2.swf 6.2.2　密码域password 密码域用于输入密码，在浏览者填入内容时，密码域内将以星号或其他系统定义的密码符号显示，以保证信息安全。 6.2.3　文本区域textarea textarea与/textarea之间的内容为初始文本内容。文本区域的常用属性有cols（列），和rows（行），cols属性设定文本区域的宽度，rows属性的值设定文本域的具体行数。 课堂案例——插入文本区域 课堂案例：插入文本区域 最终文件：光盘\最终文件\第6章\6-2-3.html 视频：光盘\视频\第6章\6-2-3.swf 课堂案例——插入隐藏域 课堂案例：插入隐藏域 最终文件：光盘\最终文件\第6章\6-2-4.html 视频：光盘\视频\第6章\6-2-4.swf 6.2.4　隐藏域hidden 很多时候传给程序的数据不需要浏览者填写，这种情况下通常采用隐藏域传递数据。隐藏域在页面中不可见，但是可以装载和传输数据。 6.2.5　复选框checkbox 为了让浏览者更快捷地在表单中填写数据，表单提供了复选框元素，浏览者可以在复选框中勾选一项或多项选项。 课堂案例——插入复选框 课堂案例：插入复选框 最终文件：光盘\最终文件\第6章\6-2-5.html 视频：光盘\视频\第6章\6-2-5.swf 课堂案例——插入单选按钮 课堂案例：插入单选按钮 最终文件：光盘\最终文件\第6章\6-2-6.html 视频：光盘\视频\第6章\6-2-6.swf 6.2.6　单选按钮radio 单选按钮和复选框一样可以快捷地让浏览者在表单中填写数据。 6.2.7　选择域select 选择域又称为列表/菜单，也是常用的用户交互表单元素。选择域的所有可选择选项都包含在select/select标签中，其子项option/option为数据选项。 6.2.8　图像域image 为了让浏览者更快捷地在表单中填写数据，表单提供了复选框元素，浏览者可以在复选框中勾选一项或多项选项。 课堂案例——插入下拉列表 课堂案例：插入下拉列表 最终文件：光盘\最终文件\第6章\6-2-7.html 视频：光盘\视频\第6章\6-2-7.swf 课堂案例——插入图像域 课堂案例：插入图像域 最终文件：光盘\最终文件\第6章\6-2-8.html 视频：光盘\视频\第6章\6-2-8.swf 6.2.9　文件域file 表单提供的文件域表单元素，能够让浏览者实现上传文件到服务器的功能。 文件域是由一个文本框和一个“浏览”按钮组成。浏览者可以通过表单的文件域来上传指定的文件，浏览者既可以在文件域的文本框中输入一个文件的路径，也可以单击文件域的“浏览”按钮来选择一个文件，当访问者提交表单时，这个文件将被上传。