ch11html表单使用题稿.pptVIP

第11章 表单 建议：2课时 11.1 表单 表单是较为复杂的HTML元素，经常与脚本、动态网页、后台数据处理等结合在一起使用，是设计动态网页的必备元素。利用表单可以在HTML页面插入一些表单元素，如文本框、提交按钮、重置按钮、单选按钮、复选框、下拉列表框等，完成各类信息的采集。本章主要介绍表单及表单元素的标记语法和属性语法。 11.1.1 表单概述 表单是动态网页中非常重要的元素，是用户与网页间进行动态交互的接口，主要用于数据采集，一个表单由如下部分组成： 表单标记：包含了处理表单数据所用CGI程序的URL，以及将数据提交到服务器所采取的方法。 表单域：包含了单行文本框、密码框、隐藏域、多行文本框、复选框、单选按钮、下拉列表框和文件选择框等。 表单按钮：包括提交按钮、重置按钮和普通按钮；用于将表单数据传送到服务器上的CGI脚本或者取消输入，还可以用表单按钮来控制其他定义了处理脚本的处理工作。 11.1.2 表单标记 表单form标记为双标记，用于声明一个表单，定义采集数据的范围，以form开始和/form结束。其间所包含的数据内容将被完整地提交到服务器。 基本语法 form name= action= method= enctype= target= input type=text / input type=password / input type=checkbox/ input type=radio/ input type=submit/ /form 11.2 表单信息输入 表单的主要功能是为用户提供输入信息的接口，将输入信息发送请求到服务器并等待服务器响应。input是表单中用于输入信息的标记。 基本语法 form input name= type= /form 11.2.1 单行文本框 input标记中type属性值text用于向表单中插入单行文本框，单行文本框中可以输入任意类型的数据，但是输入的数据只能单行显示，不能换行。 基本语法 form input name= type=text maxlength= size= value= /form 【例11-2-1】在网页上采集用户名 11.2.2 密码框文本框 设置input标记的type属性值为“password”，可以实现向表单中插入密码输入框。密码输入框中可以输入任意类型的数据，和单行文本输入框有所不同，这些数据不是显式地显示在页面上，而是显示字符“·”替代输入内容，这样设计可以保障用户输入的密码不被泄露。 基本语法 form input name= type=password maxlength= size= /form 【例11-2-2】使用密码框文本框输入用户密码 11.2.3 复选框 设置input标记的type属性值为“checkbox”， 可以实现向表单中插入复选框，用户可利用复选框在网页上设置多项选择。 基本语法 form input name= type=checkbox value= checked=”checked” /form 【例11-2-3】使用复选框选择业余爱好 11.2.4 单选按钮 设置input标记的type属性值为“radio”，可以实现向表单中插入单选按钮，用户可利用单选按钮在网页上为某一选择设置多个单选项。 基本语法 form input name= type=radio value= checked=”checked” /form 【例11-2-4】使用单选按钮选择性别 11.2.5 图像按钮 设置input标记的type属性值为“image”，可以实现向表单中插入图像按钮，用户可利用图像按钮在网页中插入一张图像，通过src属性加载图像。 基本语法 form input name= type=image src= width= height= /form 【例11-2-5】使用图像按钮在网页插入图像 11.2.6 提交按钮 设置input标记的type属性值为“submit”，可以实现向表单中插入提交按钮，提交按钮用于将表单的信息提交至服务器进行处理。 基本语法 form input name= type=submit value= /form 【例11-2-6】使用提交按钮提交用户名和密码 11.2.7 重置按钮 设置input标记的type属性值为“reset”，可以实现向表单中插入重置按钮，重置按钮用于将表单中所有的信息清空，然后让用户可以重新填写。 基本语法 form input name= type=reset value= /form 【例11-2-7】使用重置按钮重置用户名和密码 11.2.8 普通