表单制作教学设计.docxVIP

精心整理 “注册页”——表单的应用教学设计 课题 “注册页”——表单的应用 所属模块 网页制作 授课者 杨成 授课班级 授课种类 理实一体化、网络化 授课时间 3月26 授课地址 6楼机房 计划课时 1 第4节 1. 体验网站中常有的注册网页； 知识与 2. 掌握表单属常有元素的创立； 能力 理解脚本语文对表单的简单考证。 教 学过程方采用理实一体的教学模式，经过在线议论、小组合作探究等教学方法， 目 标法给学生提供学致使用的表单制作与实际应用体验。 情感态 经过制作注册表单学习，提高学生的信息化服务意识。利用注册数据 度价值 的提交与考证，增强学生的信息安全观点。 观 教学重点创立表单及其对象； 教学难点 调试表单JavaScript脚本 序号 名称 类型 形式 1 搜寻“注册页面” 习题设计 网络考试平台 教 2 MP3 学 解密“表单属性” 微课 资 源 浙江省普通高中选修 3 直播表单制作 讲堂形式 课网络直播中心 4 制作“注册页” 教学课件 Flash 学习者特 学生有一定的Dwearmweaver知识基础，在平时生活中接触过注册 征分析 页，可是对表单制作缺乏认识。 精心整理 精心整理 教学内容 课前 收集网络上常有的注册页面，观看表单制作微课，自主练习和测试 预习 一、课前预习，情景导入 课前预习。 师：同学们，上周，我们在网上考试系统中预习了表单制作，这是同学们的预习效果——大屏幕投影同学考试分数,可见大家对表单已经有一定的认识。 情景导入。 师：老师最近看了一个很有趣的视频，想和大家分享（播放美团外卖视频）。同学们，美团外卖是我们生活中常用的APP，它的用户数已达2.5亿，合作商户数超过200万家，覆盖城市超过1300个，日达成订单1800万单。现在老师给你们布置一个任务：每位同学都在美团外卖上点个外卖。 导 生：（网上操作）老师，登录要用户名和密码，我没有用户名和密码， 入 没法下单，怎么办？ 师：哦，网页中除了登录，还有没有其余的可操作链接？认真看边上 有没有“注册”，它可否帮你解决问题？ 教 生：思考，议论。 师：注册登录的意义。 学 师：好多网站功能都离不开和用户的交互。而人机对话的平台，基本 设 上是靠相应的文本框、列表框进行输入，然后经过按钮提交送至后台 计 数据库，用户登录时就能够进行身份考证，保证信息的安全。那么如 何将网页中的数据与数据库中的数据进行对照呢？ 生：能够利用表单实现。 师：那就开始我们的表单制作吧。 二、新课解说，学做合一。 1.创立表单 注册网页是网站的一个网页，所以首先要成立网站，其次在网站中 成立注册网页（reg.html）,最后在注册页中插入表单域。 （1）新建web文件夹；在web文件夹下新建images文件夹；新建 站点myweb；将下发文件放入images文件夹下。 教 （2）翻开reg.html文件； （3）插入表单域：将光标定位在要插入表单地点的中间单元格区 学 域，设置此单元格左对齐、顶端对齐，翻开“插入”面板，选择“表 过 单”类型，单击“表单”按钮（或许履行菜单“插入”—“表单”— 程 “表单”命令），在表格里插入表单域对象。在属性检查器中设置表 单属性：表单ID为form1,方法为POST，动作为result.html。 2.在表单域中插入各样表单元素 首先要创立一个表格，然后在各个单元格中插入相应的表单元素。 （1）插入单元格：在表单内插入一个队列，100%宽的表格，单元格 间距为5. （2）插入表单元素，并调整表格单元格及数据对齐方式。 精心整理 精心整理 A.用户名文本字段（username）:单击“插入”面板“表单”中的文本字段（inputtext），生成一个文本域表单。在属性检查器中设置如部下性： B.增添密码文本字段（password）：文本字段，种类为“密码”，宽度为10，最多10个字符。 C.增添密码确认文本字段（password2）:宽度为10，最多10个字符。 D.增添按钮（button）: 提交（submit）按钮：值为“提交”；动作为“提交表单”。 重置（reset）按钮：值为“重置”；动作为“重设表单”。 查验表单 为表单增添JavaScript脚本效果，考证两次密码是否相同。密码考证在单击提交按钮时进行，当两次输入密码不相同时，清 空密码从头输入，只有在两次密码相同时，才能达成正常的提交。在“提交”按钮上单击右键，选择“编写标签”命令，进入“变迁编写器”，单击“onClick”事件，输入代码： 如果要同时对密码长度进行考证，可输入以下代码: 预览网页，查察网页效果。 二、任务实施 请同学们到下载专区，下载任务实施文件夹，达成QQ注册界面的表单制作。并在账号注册成功后，登录账号。 三、总结，拓展 师：从提交的练习成就看出，