2024年2月8日发(作者：)
第6章 使用jQuery操作表单和表格
课程名称
任务名称
项目性质
授课班级
jQuery网页特效设计基础教程
使用jQuery操作表单和表格
项目名称
课时
使用jQuery操作表单和表格
5
□演示性 □验证性 □设计性 √综合性
能力目标：
授课日期
授课地点
1. 具备使用jQuery操作表单元素的能力
2. 具备使用jQuery操作表格的能力
知识目标：
教学目标
1. 了解HTML表单的功能与形式
2. 掌握使用jQuery操作表单元素的方法
3. 掌握使用jQuery操作表格的用法
素质目标：
1. 培养学生信息搜集能力
2. 培养学生团结合作、互帮互助的能力
1. 任务描述
2. 任务展示与实现
（1）对表单元素进行操作
教学内容
（2）在表格进行操作
（2）学生动手操作
3. 教师讲解本任务涉及的知识点
4. 任务小结
1. 表单的操作方法
教学重点
2. 表单元素的操作方法
3. 编写jQuery代码
教学难点
1. 使用jQuery操作表单元素及表格
1
1. 装有jQuery的电脑
教学准备
2. 教学课件PPT
3. 教材：《jQuery网页特效设计基础教程（慕课版）》刘刚 人民邮电出版社
作业设计
1．应用jQuery实现删除记录时的提示效果
教学过程
教学
环节
课前组织
课程
说明
教学内容与过程
（教学内容、教学方法、组织形式、教学手段）
做好课前“5分钟”教学管理（多媒体、实训室），做好上课前的各项准备工作（打开电脑、打开课件、打开软件、打开U盘中的素材位置、打开授课计划、教案等），吸引学生注意力。
【课前说明】
表单和表格的操作是JavaScript中非常常用的两种操作，而jQuery是一个十分简单易用的JavaScript库，因此，熟练掌握jQuery对表单和表格的操作，是网页开发人员必备的技能。本章我们将对如何使用jQuery对表单和表格操作进行详细讲解。
【目的】
使学生从了解本单元的学习目标、学习重点、考评方式等方面明确学习本单元知识的要求和目标。
课程
内容
描述
一、HTML表单
表单通常设计在一个HTML文档中，当用户填写完信息后做提交操作，将表单的内容从客户端的浏览器传送到服务器上，经过服务器处理程序后，再将用户所需信息传送回客户端的浏览器上，这样网页就具有了交互性。HTML表单是HTML页面与浏览器实现交互的重要手段。表单的主要功能是收集信息，具体说是收集浏览者的信息。在网页中，最常见的表单形式主要包括文本框、单选按钮、复选框、按钮等。
二、使用jQuery操作表单元素及表格
通过多个案例讲解jQuery操作表单元素及表格的方法，包括操作文本框、文本域、单选按钮、复选框、下拉框、表格颜色、表格行高亮、表格展开与关闭、表格内容的筛选等。
案例：
1. 在页面中分别创建一个普通按钮和一个提交按钮，普通按钮用来关闭该页面，提交按钮用来
2
提交表单。代码如下：
课堂
实训
综合实例：删除记录时的提示效果
在删除数据时，通常会给出友好的用户提示信息，待用户确认时，再删除数据，这种提示信息可以使用JavaScript的confirm确认框实现，也可以用DIV+CSS自己制作，之后通过jQuery来操作DIV元素的显示与隐藏。
本实例的要求如下。
（1）单击“删除”按钮时，显示删除提示框，用户可以单击“确认”或“取消”按钮，也可以单击右上角的“×”来关闭提示框。
（2）当单击“确认”按钮时，删除记录并且提示框消失。当单击“取消”按钮时，提示框消失。
总结
评价
通过学习，学生能够掌握HTML表单的基本概念、使用jQuery操作表单元素及表格的方法。
本节课主要运用案例教学法，通过对jQuery操作表单元素及表格方法的深入理解，掌握jQuery操作表单元素及表格方法的特点及优势，深入探讨表单元素及表格的编程方法，通过实例的方法加强对jQuery操作表单元素及表格方法的掌握，达到能够独立熟练运用jQuery操作表单元素及表格来解决实际问题的能力。教学评价方式以小组为单位，以完成案例的质量为评价标准，形成任务驱动，小组协作，质量与速度并存的课堂评价方式 ，促进学生的自主、创新学习的方式 。
3
发布者：admin，转转请注明出处：http://www.yc00.com/web/1707324566a1490367.html
评论列表（0条）