网页编程教学第五章.pptVIP

第5章 表单与特殊对象 ;5.1 创建表单 5.2 创建表单控件 5.3 设置控件的标签 5.4 网页中的特殊对象 ;5.1 创建表单 5.1.1 什么是表单 表单是用于实现网页浏览者与服务器（或者说网页所有者）之间信息交互的一种页面元素，在 WWW 上它被广泛用于各种信息的搜集和反馈。例如，图 5-1 显示了一个用于进行电子邮件系统登录的表单（图中椭圆标记的位置）。 ;图 5-1 表单示例 1 ; 图 5-2 显示了一个稍微复杂的表单，其中包含更多种类的表单控件：文本框、口令框、单选按钮、下拉菜单等。 ;5.1.2 表单控件的类型 5.1.3 FORM 标记符 ;5.2 创建表单控件 5.2.1 文本框与口令框 以下 HTML 代码显示了单行文本框和口令框的用法（也包含了表单中必须有的提交按钮），显示效果如图 5-3 所示。;HTML HEADTITLE单行文本框和口令框示例/TITLE/HEAD BODY DIV align=center H2表单——单行文本框和口令框/H2 HR FORM 请输入您的姓名： INPUT name=name value=your name pls size=30BR;请输入您的密码： INPUT type=password name=pwd value=pwd size=30P INPUT type=submit name=submit_button value=提交 /FORM HR /DIV /BODY /HTML;5.2.2 复选框与单选框 以下 HTML 代码显示了如何在表单中包含多个复选框和单选框，效果如图 5-4 所示。;HTML HEADTITLE复选框与单选框示例/TITLE/HEAD BODY H2 align=center表单--复选框与单选框/H2 HR FORM 请输入您的姓名：INPUT name=nameP 请选择您的性别： INPUT type=radio name=gender value=1男 INPUT type=radio name=gender value=2女 INPUT type=radio name=gender value=3东方不败 INPUT type=radio name=gender value=4 checked不告诉你P 请选择您的年龄： INPUT type=radio name=age value=2020岁以下 ;INPUT type=radio name=age value=30 checked20~30 INPUT type=radio name=age value=4030以上P 您喜欢什么运动： INPUT type=checkbox name=check1 value=yes checked篮球 INPUT type=checkbox name=check2 value=yes足球 INPUT type=checkbox name=check3 value=yes 排球 INPUT type=checkbox name=check4 value=yes 其他球 P align=centerINPUT type=submit name=submit_button value=提交/P /FORM HR/BODY/HTML ;5.2.3 文件选择框 以下 HTML 代码显示了如何在表单中包含文件选择框，效果如图 5-5 所示。 ;HTML HEADTITLE文件选择框示例/TITLE/HEAD BODY DIV align=centerH2表单—文件选择框/H2HR FORM 请选择文件：INPUT type = file name=image size=20P INPUT type=submit name=submit_button value=提交 /FORM HR/DIV/BODY/HTML ;5.2.4 按钮图 5-6 按钮示例 以下 HTML 代码显示了如何在表单中包含各种按钮，效果如图 5-6 所示。 ;HTML HEADTITLE按钮示例/TITLE/HEAD BODY DIV align=centerH2表单——按钮/H2HR FORM INPUT type=button name=mybutton value=点点我试试！ onClick=JavaScript:alert(呵呵，再点也没用！) P INPUT type=submit name=submit_button value=提交 INPUT type=reset name=reset_button value=重填 /FORM HR