2022年Web程序设计课堂教学教案 .pdf
《2022年Web程序设计课堂教学教案 .pdf》由会员分享,可在线阅读,更多相关《2022年Web程序设计课堂教学教案 .pdf(12页珍藏版)》请在淘文阁 - 分享文档赚钱的网站上搜索。
1、学习必备欢迎下载洛阳理工学院课堂教学教案教师姓名:课程名称: Web程序设计授课时数: 6 第 7、8、9 次课授课纲要第 4 章 ASP.NET 服务器控件4.1 ASP.NET 服务器控件概述4.2 HTML 元素和服务器控件4.2.1 HTML 元素4.2.2 HTML 服务器控件4.3 标准服务器控件4.3.1 按钮控件4.3.2 TextBox(文本框 ) 控件4.3.3 ListBox控件和 DropDownList 控件4.3.4 CheckBox(复选框 ) 和 CheckBoxList(复选框列表 ) 控件4.3.5 Image和 ImageMap控件4.3.6 RadioB
2、utton和 RadioButtonList服务器控件4.3.7 MultiView和 View 控件4.3.8 AdRotator(广告控件 ) 服务器控件4.3.9 Literal控件和 Panel 控件4.4 验证控件4.4.1 ASP.NET 验证控件4.4.2 验证 Web窗体页中的用户输入4.5 用户控件教学目标1了解 ASP.NET服务器控件的分类、定义2掌握如何向网页添加ASP.NET服务器控件, 如何配置控件的属性、3行为和外观以及如何以编程方式使用这些控件。教学重点1ASP.NET服务器控件的属性、方法、事件2ASP.NET服务器控件的事件触发机制教学难点ASP.NET服务
3、器控件的方法使用方法教学方法及手段项目驱动,案例教学,一体化课堂;板书+多媒体。教学过程设计详细授课内容及具体过程,见正文描述。课外拓展试编写一个具有计算器功能的页面作业布置1 复习服务器控件实验,编写实验4 上机程序。教学后记名师归纳总结 精品学习资料 - - - - - - - - - - - - - - -精心整理归纳 精选学习资料 - - - - - - - - - - - - - - - 第 1 页,共 12 页 - - - - - - - - - 学习必备欢迎下载以下内容属于第7 次课:第 4 章 ASP.NET服务器控件 主要介绍 HTML 服务器控件、标准服务器控件、验证控件和
4、用户控件 4.1 ASP.NET 服务器控件概述在网页上经常看到填写信息用的文本框、单选按钮、复选框、下拉列表等元素,它们都是控件。 控件是可重用的组件或对象,有自己的 属性 和方法 ,可以响应事件 。ASP.NET服务器控件是服务器端ASP.NET网页上的对象 ,当用户通过浏览器请求 ASP.NET 网页时,这些控件将运行并把生成的标准的HTML 文件发送给客户端浏览器来呈现。在 ASP.NET 页面上,标准服务器控件表现为一个标记 , 例如 。这些标记不是标准的HTML 元素,因此如果它们出现在网页上,浏览器将无法理解它们, 然而,当从 Web服务器上请求一个ASP.NET 页面时,这些标
5、记都将动态地转换为 HTML 元素,因此浏览器只会接收到它能理解的HTML 内容。在创建 .aspx页面时,可以将任意的服务器控件放置到页面上,然而请求服务器上该页面的浏览器将只会接收到HTML 和 JavaScript脚本代码, 如图 4-1所示。Web浏览器无法理解ASP.NET 。 Web浏览器只理解HTML ,可能也理解JavaScript 但它 不能处理 ASP.NET 代码。 服务器读取 ASP.NET 代码并进行处理,将所有ASP.NET特有的内容转换为HTML以及( 如果浏览器支持的话 ) 一些JavaScript代码,然后将最新生成的HTML 发送回浏览器。ASP.NET 服
6、务器控件主要类别有HTML 服务器控件、标准服务器控件、验证控件、用户控件、数据控件、导航控件等。4.2 HTML 服务器控件 描述如何使用 VWD2008 工具箱的“HTML ” 选项卡上的 ASP.NET 服务器控件 4.2.1 HTML 元素在 VWD2008 中,从工具箱添加到页面上的HTML 服务器控件只是已设置了某些属性的 HTML 元素,当然也可通过输入HTML 标记在“源”视图中创建HTML 元素。默认情况下, ASP.NET 文件中的 HTML 元素作为文本进行处理,并且不能在服务器端代码中引用这些元素, 只能在客户端通过javascript和 vbscript等脚本语言来控
7、制。名师归纳总结 精品学习资料 - - - - - - - - - - - - - - -精心整理归纳 精选学习资料 - - - - - - - - - - - - - - - 第 2 页,共 12 页 - - - - - - - - - 学习必备欢迎下载工具箱的“ HTML ”选项卡上提供了一些基于HTML INPUT元素的控件。本节通过下列两个控件HTML INPUT 元素的使用方法。4.2.1 HTML 元素(1) Input (Button) 控件, 按钮控件:默认情况下是“INPUT type=button元素” 。(2)Input (Text) 控件,文本框控件: 默认情况下是 “
8、INPUT type=text元素” 。Input(Button)元素的主要功能是创建一个用来触发事件处理程序的按钮,通过使用 onclick属性来表明单击按钮可以触发的处理方法。其主要属性有:ID :此控件的编程名称;value :设置按钮中显示的文字。【例 4-1 】演示如何使用Input (Text)元素和 Input (Button)元素 结合操作讲解 参见教材。4.2.2 HTML 服务器控件在 VWD2008 中,从工具箱添加到 ASP.NET 页面上的 HTML 服务器控件只是已设置了某些属性的HTML 元素。默认情况下, 这些添加到 ASP.NET 文件中的 HTML 元素被视
9、为传递给浏览器的标记,作为文本进行处理, 不能在服务器端的代码中引用这些元素。若要使这些元素能以编程方式进行访问,可以通过添加runat=server属性表明应将HTML 元素作为服务器控件进行处理。还可设置HTML 元素的 id 属性,这样就可使用基于服务器的代码对其进行编程引用了。【例 4-2 】 演示如何使用工具箱的Input(Button)服务器控件、Input(Text)服务器控件 结合操作讲解 步骤请参见教材。4.3 标准服务器控件ASP.NET包含大量可在ASP.NET网页上使用的标准服务器控件。本节重点从 ASP.NET 服务器控件的工作原理和过程入手,介绍控件的常用功能和用法
10、。4.3.1 按钮控件可使用 ASP.NET Button 服务器控件为用户提供向服务器发送网页的能力。该控件会在服务器代码中触发一个事件 ,可以处理该事件来响应回发。ASP.NET包括三种按钮控件,每种按钮控件在网页上显示的方式都不同,如下表 4-1 所列:(1)按钮事件 :当用户单击任何Button (按钮)服务器控件时,会将该页发送到服务器。这使得在基于服务器的代码中,网页被处理, 任何挂起的事件被引发。 这些按钮名师归纳总结 精品学习资料 - - - - - - - - - - - - - - -精心整理归纳 精选学习资料 - - - - - - - - - - - - - - - 第
11、 3 页,共 12 页 - - - - - - - - - 学习必备欢迎下载还可引发它们自己的Click事件,可以为这些事件编写“事件处理程序”。(2)按钮回发行为: 重点 当用户单击按钮控件时,该页回发到服务器 。默认情况下,该页回发到其本身,在这里重新生成相同的页面并处理该页上控件的事件处理程序。可以配置按钮以将当前页面回发到另一页面 。这对于创建多页窗体可能非常有用。在某些情况下, 可能希望 Button 控件也使用客户端脚本执行回发。这在希望以编程方式操作回发 (如将回发附加到页面上的其他元素)时非常有用。 可以将 Button 控件的 UseSubmitBehavior 属性 设置为
12、 true 以使 Button 控件使用基于客户端脚本的回发。(3)处理 Button 控件的客户端事件Button 控件既可以引发 服务器事件 ,也可以引发 客户端事件 。服务器事件在回发后发生, 且这些事件在为页面编写的服务器端代码中处理。客户端事件在客户端脚本(通常为ECMAScript(JavaScript))中处理,并在提交页面前引发。通过向 ASP.NET 按钮控件添加客户端事件, 可以执行一些任务 (如在提交页之前显示确认对话框以及可能取消提交) 。【例 4-3】演示 Button 控件、LinkButton控件、ImageButton 控件的使用。步骤请参见教材。 结合操作讲解
13、 4.3.2 TextBox(文本框)控件TextBox 服务器控件是 让用户向 ASP.NET网页输入文本的控件 。默认情况下,该控件的 TextMode属性设置为 TextBoxMode .SingleLine,这将显示一个单行文本框。但可以将TextMode 属性设置为 TextBoxMode.MultiLine,以显示多行文本框(该文本框将作为textarea元素呈现) 。也可以将 TextMode属性更改为 TextBoxMode.Password,以显示屏蔽用户输入的文本框。通过使用Text 属性可以获得 TextBox 控件中显示的文本。安全说明: 将 TextMode属性设置为
14、 TextBoxMode.Password 可有助于确保在输入密码时其他人无法看到。 但是,输入到文本框中的文本没有以任何方式进行加密,为了提高安全性, 在发送其中带有密码的页时,可以使用安全套接字层(SSL)和加密。【例 4-4】演示文本框 TextBox 控件、标签 Label 控件、按钮 Button 控件的使用。 结合操作讲解 步骤请参见教材。名师归纳总结 精品学习资料 - - - - - - - - - - - - - - -精心整理归纳 精选学习资料 - - - - - - - - - - - - - - - 第 4 页,共 12 页 - - - - - - - - - 学习必备欢
15、迎下载以下内容属于第8 次课:4.3.3 ListBox控件和 DropDownList 控件ListBox 服务器控件使用户能够从预定义的列表中选择一项或多项 。DropDownList 服务器控件使用户可以从预定义的下拉列表中选择单个项,它与 ListBox 服务器控件的不同之处在于,其选项列表在用户单击下拉按钮之前一直保持隐藏状态 。此外, DropDownList 控件不支持多重选择模式。DropDownList控 件 的 某 个 选 项 被 选 中 时 , 该 控 件 将 引 发SelectedIndexChanged事件。默认情况下,此事件不会导致向服务器发送页,但可通过将 Aut
16、oPostBack 属性设置为 true ,强制该控件立即发送 。如 果 将 ListBox控 件 的 属 性 SelectionMode的 值 从 “Single ” 改为“Multiple”将允许进行多重选择,用户可以在按住Ctrl或 Shift键的同时,单击以选择多个项。【例 4-5】演示 ListBox 控件和 DropDownList 控件的使用。步骤请参见教材。 结合操作讲解 4.3.4 CheckBox (复选框)和 CheckBoxList (复选框列表)控件CheckBox控件和 CheckBoxList 控件分别用于向用户提供选项和选项列表。CheckBox 控件适合用在选
17、项不多且比较固定的情况,当选项较多或需在运行时动态决定有哪些选项时,使用CheckBoxList 控件比较方便。【例 4-6】 演示复选框控件 CheckBox和复选框列表控件CheckBoxLis 使用。步骤请参见教材 。 结合操作讲解 4.3.5 Image和 ImageMap控件ASP.NET 3.5 包含两个图形控件,一个Image, 一个是 ImageMap控件。(1)Image服务器控件使您可以在ASP.NET 网页上显示图像 ,并用自己的代码管理这些图像。 可以在设计时或运行时以编程方式为Image 对象指定图形文件。还可以将控件的ImageUrl 属性绑定到一个数据源,以根据数
18、据库信息显示图形。与大多数其他服务器控件不同,Image控件不支持任何事件。例如,Image控件不响应鼠标单击事件。实际上,可以通过使用ImageMap或 ImageButton 控件来创建交互式图像。(2)Imagemap说白了 就是一种图形 ,包括许多不同部分,将鼠标指针指在图形的各个部分,点一下鼠标左键,就可以进入另一个超级链接的页面。Imagemap不一定要真的是map ,可以是任何图形。比如一张脸好了,将鼠标点在眼睛上就出现关于眼睛的页面,点在鼻子上就出现鼻子的页面(很适合做成整容外科的网页吧?!),也是一种 ImageMap 。名师归纳总结 精品学习资料 - - - - - - -
19、 - - - - - - - -精心整理归纳 精选学习资料 - - - - - - - - - - - - - - - 第 5 页,共 12 页 - - - - - - - - - 学习必备欢迎下载ImageMap控件由两个元素组成。第一个是 图像,它可是任何标准Web图形格式的图形,如 .gif、.jpg 或.png 文件。第二个元素是HotSpot(作用点)控件 的集合。每个作用点控件都是一个类型为 CircleHotSpot 、RectangleHotSpot 或 PolygonHotSpot 的不同项。对于每个作用点控件, 都要定义用于指定该作用点的位置和大小的坐标。例如,如果创建一个
20、 CircleHotSpot控件,则需要定义圆心的x 和 y 坐标以及圆的半径。响应用户单击 :每一个作用点都可以是一个单独的超链接或回发事件。可以指定用户单击作用点时发生的事件,可以将每个作用点配置为可以转到为该作用点提供的 URL的超链接。或者,也可以将控件配置为在用户单击某个作用点时执行回发,并可为每个作用点提供一个唯一值。回发会引发ImageMap控件的Click 事件。在事件处理程序中,可以读取分配给每个作用点的唯一值。【例 4-7】演示 Image控件和 ImageMap控件的使用。 结合操作讲解 步骤请参见教材。提示: HotSpots (作用点)的坐标以像素为单位,在Windo
21、ws的【画图】程序中打开, 任选一种画图工具, 移动鼠标, 在下部状态栏中可看到当前鼠标所在处的像素点的坐标,如图4-11 所示。4.3.6 RadioButton和 RadioButtonList 服务器控件在向ASP.NET网页添加单选按钮时,可以使用两种服务器控件:单 个RadioButton 控件或 RadioButtonList控件。这两种控件都允许用户从一小组互相排斥的预定义选项中进行选择。 这些控件允许您定义任意数目带标签的单选按钮,并将它们水平或垂直排列。每类控件都有各自的优点。单个RadioButton 控件使您可以 更好地控制单选按钮组的布局 。例如,可以在各单选按钮之间加
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 2022年Web程序设计课堂教学教案 2022 Web 程序设计 课堂教学 教案
限制150内