Web程序设计实验指导书.docx

《Web程序设计实验指导书.docx》由会员分享，可在线阅读，更多相关《Web程序设计实验指导书.docx（52页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、Web 程序设计试验指导书杨松波2023.09试验一 C#和 ASP.Net3.5一试验目的(1) 了解 C#语言标准(2) 把握 C#根底语法、流程把握和特别处理等。(3) 把握创立 C#类并应用于 ASP.NET3.5 Web 窗体中的方法。二.试验内容及要求1. 转换输入的成绩到相应的等级要求如下：（1） 页面扫瞄效果如图 1-1 所示（2） 成绩输入使用 TextBox 控件。（3） 点击 Button 控件时输出相应的等级信息，其中等级信息输出在一个 Label 上图 1-1 成绩转换扫瞄效果2. 在 Web 窗体上输出九九乘法表扫瞄效果如图 1-2 所示图 1-2 “九九乘法表”扫

2、瞄效果3. 输入一组以空格间隔的共 10 个以内的整数，输出该组整数的降序排列要求如下：（1） 页面扫瞄效果如图 1-3 所示。（2） 输入使用 TextBox 控件。（3） 单击 Botton 控件时输出全部整数的降序排列。（4） 必需使用数组。图 1-3 降序排列扫瞄效果4. 计算两个数的商要求如下：（1） 页面扫瞄效果如图 1-4 和图 1-5 所示。（2） 输入使用两个 TextBox 控件。（3） 单击 Botton 控件时输出两个数的商。（4） 必需包含特别处理。图 1-4 计算商扫瞄效果1图 1-5 计算商扫瞄效果25. 设计一个用户信息类 UserInfo要求如下：（1） 包括

3、两个属性：姓名Name和生日Birthday。（2） 包括一个方法DecideAge用于推断用户是否到达规定年龄。当年龄大于等于 18 岁时返回值“XXX，您是成年人了!”; 当年龄小于 18 岁时返回值“XXX，您还没长大呢!”。6. 将 UserInfo 类应用于 Web 窗体中页面扫瞄效果如图 1-6 和图 1-7 所示。图 1-6 UserInfo 类扫瞄效果图1 图 1-7 UserInfo 类扫瞄效果图2三.试验步骤1. 转换输入的成绩到相应的等级（1） 设计 Web 窗体建一个 Web 窗体，切换到设计视图。如图 1-8 所示，向页面添加 1 个 TextBox 控件、1 个 B

4、otton 控件和 1 个 Lable 控件。图 1-8 设计界面（2） 设置属性Web 窗体中各控件的属性设置如表 1-1 所示。表 1-1 各控件的属性设置表控件TextBox BottonLabel属性名ID IDText IDText属性值txtInput btnSubmit 等级lblDisplay空说明“输入成绩”文本框的编程名称“等级”按钮的编程名称 “等级”按钮上显示的文本用来显示等级信息的 Label 控件编程名称出示不显示任何内容（3） 编写大事代码按钮 btnSubmit 被单击时执行的大事代码如下：protected void btnSubmit_Click(objec

5、t sender, EventArgs e)float fGrade = float.Parse(txtInput.Text); int iGrade = (int)(fGrade / 10);switch (iGrade)case 10:case 9:lblDisplay.Text = “优秀“; break;case 8:lblDisplay.Text=“良“; break;case 7:lblDisplay.Text=“中“; break;case 6:lblDisplay.Text=“及格“; break;case 5:case 4:case 3:case 2:case 1:case

6、0:lblDisplay.Text = “不及格“; break;（4） 扫瞄建立的 Web 窗体进展测试。2. 在 Web 窗体上输出九九乘法表建一个 Web 窗体，切换到设计视图。在空白处双击，编写 Web 窗体载入时执行代码如下：protected void _Load(object sender, EventArgs e)for (int i = 1; i = 9; i+)for (int j = 1; j = i; j+)Response.Write(i.ToString + “*“ + j.ToString + “=“ + (i * j).ToString); Response.W

7、rite(“  “);Response.Write(“);最终，扫瞄建立的 Web 窗体查看效果。3. 输入一组以空格间隔的共 10 个以内的整数，输出该组整数的降序排列（1） 设计 Web 窗体建一个 Web 窗体，切换到设计视图。如图 1-9 所示，向页面添加 1 个 TextBox 控件、1 个 Botton 控件。图 1-9 设计界面（2） 设置属性Web 窗体中各控件的初始属性设置如表 1-2 所示。表 1-2 各控件的属性设置表控件TextBox Botton属性名ID IDText属性值txtInput btnSubmit降序说明“输入一组数据”文本框的编程名称

8、“降序级”按钮的编程名称“降序”按钮上显示的文本（3） 编写大事代码按钮 btnSubmit 被单击时执行的大事代码如下：protected void btnSubmit_Click(object sender, EventArgs e)“ “;string sInput;int j=0;int aInput = new int10; string temp = “0“;for (int i = 0; i = sInput.Length - 1; i+)if (sInput.Substring(i, 1) != “ “)temp += sInput.Substring(i, 1);elseaI

9、nputj = int.Parse(temp); j+;temp = “0“;Array.Sort(aInput); Array.Reverse(aInput); foreach (int i in aInput)if (i != 0)Response.Write(i + “  “);（4） 扫瞄建立的 Web 窗体进展测试。4. 计算两个数的商（1） 设计 Web 窗体建一个 Web 窗体，切换到设计视图。如图 1-10 所示，向页面添加 2 个 TextBox 控件、1 个 Botton 控件。图 1-10 设计界面（2） 设置属性Web 窗体中各控件的初始属性设置如表

10、1-3 所示。表 1-3 各控件的属性设置表控件TextBox TextBoxBotton属性名ID ID IDText属性值txtDivsor txtDivided btnSubmit提交说明“除数”文本框的编程名称 “被除数”文本框的编程名称“提交”按钮的编程名称“提交”按钮上显示的文本（3） 编写大事代码按钮 btnSubmit 被单击时执行的大事代码如下：protected void btnSubmit_Click(object sender, EventArgs e)tryfloat divsor = float.Parse(txtDivsor.Text); float divide

11、nd = float.Parse(txtDividend.Text); Response.Write(“商为:“ + divsor / dividend);catch(Exception ee)Response.Write(“系统提示“+ee.Message+“); Response.Write(“请输入正确的数字“);（4） 扫瞄建立的 Web 窗体进展测试。5. 设计一个用户信息类 UserInfo（1） 右击App_Code 文件夹，选择“添加项”“类”模板，重命名为UserInfo.cs,单击“添加”按钮。（2） 输入代码如下：public class UserInfoprivate

12、string _Name; private DateTime _Birthday; public string Namegetsetreturn _Name;_Name = value;public DateTime Birthdaygetsetreturn _Birthday;_Birthday = value;public UserInfo(string name,DateTime birthday)/TODO: 在此处添加构造函数规律/this.Name = name; this.Birthday = birthday;public string DecideAgeif (DateTim

13、e.Now.Year - _Birthday.Year 18)return this._Name + “您还没长大呢！“;elsereturn this._Name + “您已经成年了“;6. 将 UserInfo 类应用于 Web 窗体中（1） 设计 Web 窗体建一个 Web 窗体，切换到设计视图。如图 1-11 所示，向页面添加 2 个 TextBox 控件、1 个 Botton 控件。图 1-11 设计界面（2） 设置属性Web 窗体中各控件的初始属性设置如表 1-4 所示。表 1-4 各控件的属性设置表控件TextBox TextBoxBotton属性名ID ID IDText属性值

14、txtName txtBirthday btnSubmit提交说明“姓名”文本框的编程名称“生日”文本框的编程名称“提交”按钮的编程名称“提交”按钮上显示的文本（3） 编写大事代码按钮 btnSubmit 被单击时执行的大事代码如下：protected void btnSubmit_Click(object sender, EventArgs e)null);string name = txtName.Text;string birthday = txtBirthday.Text;UserInfo userInfo = new UserInfo(name, DateTime.ParseExac

15、t(birthday, “yyyymmdd“,Response.Write(userInfo.DecideAge);（4） 扫瞄建立的 Web 窗体进展测试。试验二 ASP.NET 3.5 标准控件一试验目的(1) 理解 ASP.NET 3.5 页面大事处理流程。(2) 理解 ASP.NET 3.5 标注控件的应用。二.试验内容及要求1. 设计并实现一个简易的计算器要求如下：(1) 页面扫瞄效果如图 2-1 所示(2) 仿照一般计算器的工作方式，实现加和减的功能。图 2-1 “简易计算器”扫瞄效果2. 设计并实现一个用于查询教师课表的联动下拉列表框页面 要求如下：(1)页面扫瞄效果如图 2-2

16、 所示(2)“学年”下拉列表框中添加十个数据项：当前学年及之前的九个学年。 (3)“学期”下拉列表框中添加两个数据项：1 和 2. (4)“分院”下拉列表框中添加三个数据项：“数学与信息工程学院”、“机电学院”和“外 国语学院”。(5)“教师”下拉列表框中的数据项依据不同的分院产生。图 2-2 联动下拉列表框扫瞄效果3. 设计并实现一个用于单项选择题的测试页面要求如下：(1) 页面扫瞄效果如图 2-3 所示(2) 试题要求和选择题必需动态生成。(3) 如图 2-4 所示，当单击提交按钮时，给出选择的答案。图 2-3 测试页面效果1图 2-4 测试页面效果2三.试验步骤1. 设计并实现一个简易的

17、计算器（1） 设计 Web 窗体建一个 Web 窗体，切换到设计视图。如图 2-5 所示，向页面添加 1 个用于布局的 1 行 1列黑色边框表格。向表格中添加一个 TextBox 控件、6 个 Botton 控件。图 2-5（2） 设置属性Web 窗体中各控件的属性设置如表 2-1 所示。表 2-1各控件的属性设置表控件属性名属性值说明TextBoxBotton BottonIDReadOnly IDTextIDtxtDisplay True btnOne1btnTwo用于显示输入数字的文本框控件编程名称不能更改文本框中的文本，默认值为 False “数字 1”按钮的编程名称“数字 1”按钮上

18、显示的文本“数字 2”按钮的编程名称BottonTextIDText2btnThree 3“数字 2”按钮上显示的文本“数字 3”按钮的编程名称“数字 3”按钮上显示的文本Botton BottonBottonIDText IDText IDTextbtnAdd+btnSubtract-btnEqual=“+”按钮的编程名称“+”按钮上显示的文本“-”按钮的编程名称“-”按钮上显示的文本“=”按钮的编程名称“=”按钮上显示的文本（3） 编写大事、方法代码在全部大事、方法外声明静态字段。静态字段保证了其中的数据可以在全部的大事、方 法中被访问，并能在大事代码或方法代码执行完毕后保存数据。其中，静

19、态字段num1 用于存储算式中的第一个数字字符串，初始值为“0”；num2 用于存储算式中的其次个数字字符串，初始值为“0”；total 用于存储将全部输入的数连接后的数字字符串，初始值为“”空字符串；sign 用于存储运算符号，初始值为“”。代码如下：static string num1 = “0“, num2 = “0“, total = “, sign = “;按钮 btnOne 被单击时执行的大事代码如下：protected void btnOne_Click(object sender, EventArgs e)total += “1“;/将数字字符串“1“与 total 原值连接后

20、再存入 total txtDisplay.Text = total;按钮 btnTwo 被单击时执行的大事代码如下：protected void btnTwo_Click(object sender, EventArgs e)total += “2“; txtDisplay.Text = total;按钮 btnThree 被单击时执行的大事代码如下：protected void btnThree_Click(object sender, EventArgs e)total += “3“; txtDisplay.Text = total;按钮 btnAdd 被单击时执行的大事代码如下：prot

21、ected void btnAdd_Click(object sender, EventArgs e)if (sign.Length = 1)/sign 已存储运算符号Count;/调用 Count方法计算结果num1 = txtDisplay.Text;sign = “+“;else/sign 未存储运算符号num1 = txtDisplay.Text; txtDisplay.Text = “; total = “;sign = “+“;按钮 btnSubtract 被单击时执行的大事代码如下：protected void btnSubtract_Click(object sender, E

22、ventArgs e)if (sign.Length = 1)/sign 已存储运算符号Count;/调用自定义方法 Count计算结果num1 = txtDisplay.Text;sign = “-“;else/sign 未存储运算符号num1 = txtDisplay.Text; txtDisplay.Text = “; total = “;sign = “-“;按钮 btnEqual 被单击时执行的大事代码如下：protected void btnEqual_Click(object sender, EventArgs e)Count;/调用自定义方法 Count计算结果/ / 计算“n

23、um1 运算符 num2”的结果/ protected void Countnum2 = txtDisplay.Text;if (num2 = “)/num2 值为空字符串num2 = “0“;switch (sign)/依据不同的运算符分别计算结果case “+“:txtDisplay.Text = (int.Parse(num1) + int.Parse(num2).ToString; num1 = “0“;num2 = “0“;total = “;sign = “; break;case “-“:txtDisplay.Text = (int.Parse(num1) - int.Parse

24、(num2).ToString; num1 = “0“;num2 = “0“;total = “;sign = “; break;（4） 扫瞄建立的 Web 窗体进展测试。2. 设计并实现一个用于查询教师课表的联动下拉列表框页面（1） 设计 Web 窗体建一个 Web 窗体，切换到设计视图。如图 2-6 所示，向页面输入“学年：”、“学期：”、“分院：”和“教师：”等信息，适当设置字体大小。再向页面添加 4 个 DropDownList 控 件，适当调整个控件的大小和位置。图 2-6（2） 设置属性Web 窗体中各控件的属性设置如表 2-2 所示。表 2-1 各控件的属性设置表控件DropDo

25、wnList DropDownList DropDownList属性名IDAutoPostBack IDAutoPostBack IDAutoPostBack属性值ddlYear True ddlTerm True ddlCollege True说明“学年”下拉列表框的编程名称当列表项内容转变后，自动触发页面来回“学期”下拉列表框的编程名称当列表项内容转变后，自动触发页面来回“分院”下拉列表框的编程名称当列表项内容转变后，自动触发页面来回DropDownListIDddlTeacher“教师”下拉列表框的编程名称AutoPostBack（3） 编写大事、方法代码True当列表项内容转变后，自动

26、触发页面来回Web 窗体首次载入时执行的代码如下：protected void _Load(object sender, EventArgs e)/页面第一次载入，向各下拉列表填充值 if (!IsPostBack)BindYear;BindTerm;BindCollege;BindTeacher;当“分院”下拉列表框中选择项转变时，触发的大事代码如下：protected void ddlCollege_SelectedIndexChanged(object sender, EventArgs e)BindTeacher;自定义方法 BingYear的代码如下： protected void

27、BindYear/清空学年下拉列表中项/向学年下拉列表添加项for (int i = startYear; i = currentYear; i+)ddlYear.Items.Add(new ListItem(i - 1).ToString + “-“ + i.ToString);/设置年份下拉列表默认项ddlYear.SelectedValue = (currentYear - 1).ToString + “-“ + currentYear.ToString;自定义方法 BingTerm的代码如下： protected void BindTermd/向学期下拉列表添加项for (int i

28、= 1; i = 2; i+)自定义方法 BingCollege的代码如下： protected void BindCollege自定义方法 BingTeacher的代码如下： protected void BindTeacherswitch (ddlCollege.SelectedValue)/依据不同的分院产生不同的教师姓名case “数学与信息工程学院“:/添加教师列表。在实际工程中，数据来源于数据库break;case “外国语学院“: break;case “机电学院“: break;最终，扫瞄建立的 Web 窗体查看效果。3. 设计并实现一个用于单项选择题的测试页面（1） 设计 W

29、eb 窗体建一个 Web 窗体，切换到设计视图。如图 2-7 所示，向页面添加 1 个 PlaceHolder 控件、1 个 Botton 控件和 1 个 Label 控件，适当调整个控件的大小和位置。图 2-7（2） 设置属性Web 窗体中各控件的初始属性设置如表 2-3 所示。表 2-3 各控件的属性设置表控件TextBoxLabel属性名IDText IDText属性值btnSubmit 提交lblDisplay空说明“提交”按钮的编程名称 “提交”按钮上显示的文本用来显示选择结果的 Label 控件编程名称初始不显示任何内容（3） 编写大事代码Web 窗体首次载入时执行的代码如下：pr

30、otected void _Load(object sender, EventArgs e)/定义 Label 控件 lblQuestion1 Label lblQuestion1 = new Label; lblQuestion1.ID = “lblQuestion1“;/设置题目要求。在实际工程中，数据来源于数据库lblQuestion1.Text = “1.Web 效劳器控件不包括 。“;/将 lblQuestion1 控件添加到 PlaceHolder1 中/定义 RadioButtonList 控件 rdoltChoice1 RadioButtonList rdoltChoice1

31、= new RadioButtonList; rdoltChoice1.ID = “rdoltChoice1“;/设置单项选择项。在实际工程中，数据来源于数据库em(“D.Calender“, “D“);按钮 btnSubmit 被单击时执行的大事代码如下：protected void btnSubmit_Click(object sender, EventArgs e)/查找 rdoltChoice1 控件RadioButtonListrdoltChoice1= (RadioButtonList)PlaceHolder1.FindControl(“rdoltChoice1“);lblDisp

32、lay.Text = “你选择了：“ + rdoltChoice1.SelectedValue;（4） 扫瞄建立的 Web 窗体进展测试。试验三 ASP.NET 3.5 验证控件一试验目的(1) 理解客户端和效劳器端验证。(2) 把握 ASP.NET 3.5 各验证控件的使用。(2) 把握分组验证的方法。二.试验内容及要求1. 设计并实现一个带验证控件的用户注册页面要求如下：(1)页面扫瞄效果如图 3-1 和图 3-2 所示(2)“用户名”、“密码”、“确认密码”、“生日”、“ 号码”和“身份证号”等信 息必需输入。(3) “密码”和“确认密码”的输入值必需全都。(4) “生日”的输入值必需在

33、 1900-1-1 到 2023-1-1 之间。(5) “ 号码”(6) “身份证号”中的诞生年月信息必需为合法的日期数据。(7) 能汇总显示全部的验证错误信息，并以独立的对话框显示。(8) 当验证控件消灭验证错误时，焦点会定位在消灭验证错误的文本框中。 (9)假设通过全部的验证，则显示“验证通过”的信息。图 3-1 “用户注册验证”扫瞄效果1图 3-2 “用户注册验证”扫瞄效果22. 设计并实现同一个页面的分组验证功能要求如下：(1) 页面扫瞄效果如图 3-2 所示图 3-3 “分组验证”扫瞄效果1(2) 如图 3-4 所示，当点击“用户名是否可用”按钮时，仅对“用户名”进展验证。图 3-4

34、 “分组验证”扫瞄效果2(3) 如图 3-5 和图 3-6 所示，当在“用户名”文本框中输入 jxssg，再单击“用户名是否可用” 按钮时输出“内疚！该用户名已被占用！”的信息；当在“用户名”文本框中输入其它信息，再单击“单击用户名是否可用”按钮时输出“恭喜！该用户名可用！”的信息。图 3-5 “分组验证”扫瞄效果3图 3-6 “分组验证”扫瞄效果4(4) 如图 3-7 所示，当单击“确定”按钮时，对“密码”、“确认密码”、“生日”、“ 号码”和“身份证号”进展验证。图 3-7 “分组验证”扫瞄效果5三.试验步骤1. 设计并实现一个带验证控件的用户注册页面（1） 设计 Web 窗体建一个 We

35、b 窗体，切换到设计视图。如图 3-8 所示，向页面输入“用户名”、“密码：”、“确认密码：”、“生日：”、“ 号码：”和“身份证号：”等信息；添加 6 个 TextBox 控件、6 个 RequiredFieldValidator 控件、1 个 CompareValidator 控件、1 个RangeValidator 控件、1 个 RegularExpressionValidator 控件、1 个 CustomValidator 控件，1 个 Botton 控件、1 个 Label 控件和 1 个 ValidatorSummary 控件。适当调整个控件的位置和大小。（2） 设置属性图 3-

36、8 设计界面1Web 窗体中各控件的属性设置如表 3-1 所示。表 3-1 各控件的属性设置表控件TextBox RequiredFieldValidator属性名ID IDControlToValidate ErrorMessage属性值txtName rfvNametxtName请输入用户名说明 “用户名”文本框的编程名称 “ 必 须 输 入 验证”控件的编程名称验证“用户名” 文本框验 证 无 效 时 在“汇总验证”控件中显示的错误信息SetFocusOnErrorTrue验证无效时将焦点定位到“用户名”文本框TextTextBoxIDTextModeRequiredFieldValid

37、atorIDControlToValidate ErrorMessage* txtPassword Password rfvPasswordtxtPassword请输入密码验证无效时提示的错误信息 “密码”文本框的编程名称设置“密码”文本框为密码模式“ 必 须 输 入 验证”控件的编程名称验证“密码”文本框验 证 无 效 时 在“汇总验证”控件中显示的错误信息SetFocusOnErrorTrue验证无效时将焦点定位到“密码” 文本框TextTextBoxIDTextMode* txtPasswordAgain Password验证无效时提示的错误信息 “确认密码”文本框的编程名称设置“确认密

38、码” 文本框为密码模式RequiredFieldValidatorIDrfvPasswordAgain“ 必 须 输 入 验证”控件的编程名称ControlToValidate ErrorMessagetxtPasswordAgain请输入确认密码验证“确认密码” 文本框验 证 无 效 时 在“汇总验证”控件中显示的错误信息SetFocusOnErrorTrue验证无效时将焦点定位到“确认密码”文本框TextCompareValidatorID ControlToCompare ControlToValidate ErrorMessage* cvPassword TxtPasswordTxtP

39、asswordAgain密码与确认密码不全都验证无效时提示的错误信息 “比较验证”控件的编程名称与“密码”文本框比较验证“确认密码” 文本框验 证 无 效 时 在“汇总验证”控件中显示的错误信息SetFocusOnErrorTrue验证无效时将焦点定位到“确认密码”文本框TextBox RequiredFieldValidatorID IDControlToValidate ErrorMessagetxtBirthday rfvBirthdaytxtBirthday请输入生日“生日”文本框的编程名称“ 必 须 输 入 验证”控件的编程名称验证“生日”文本框验 证 无 效 时 在“汇总验证”控件

40、中显示的错误信息SetFocusOnErrorTrue验证无效时将焦点定位到“生日” 文本框Text*验证无效时提示的错误信息RangeValidatorID ControlToValidate ErrorMessageMaximumValue MinimumValue SetFocusOnErrorTypervBirthday txtBirthday日期应在 1900-1-1到 2023-1-1 之间2023-1-11900-1-1TrueDate“范围验证”控件的编程名称验证“生日”文本框验 证 无 效 时 在“汇总验证”控件中显示的错误信息设置最大的日期为 2023-1-1设置最小的日期

41、为 1900-1-1验证无效时将焦点定位到“生日” 文本框要比较的值为日期型TextBox RequiredFieldValidatorID IDControlToValidate ErrorMessagetxtTelephone rfvTelephonetxtTelephone请输入 号码“ 号码”文本框的编程名称“ 必 须 输 入 验证”控件的编程名称验证“ 号码” 文本框验 证 无 效 时 在“汇总验证”控件中显示的错误信息SetFocusOnErrorTrue验证无效时将焦点定位到“ 号码”文本框Text RegularExpressionValidatorID* revTelepho

42、ne验证无效时提示的错误信息 “规章表达式验证”控件的编程名称ControlToValidate ErrorMessagetxtTelephone验证“ 号码” 文本框验 证 无 效 时 在“汇总验证”控件中显示的错误信息ValidationExpressiond4-d8表达式为“4 个数字-8 个数字”SetFocusOnErrorTrue验证无效时将焦点定位到“ 号码”文本框TextBox RequiredFieldValidatorID IDControlToValidate ErrorMessagetxtIdentity rfvIdentitytxtIdentity请输入身份证号“身份证号”文本框的编程名称“ 必 须 输 入 验证”控件的编程名称验证“身份证号” 文本框验 证 无 效 时 在“汇总验证”控件中显示的错误信息SetFocusOnErrorTrue验证无效时将焦点定位到“身份证号”文本框Text RegularExpressionValidatorIDControlToValidate ErrorMessage* cvIdentity txtIdentity身份证号错误！验证无效时提示的错误信息 “自定义验证” 控件的编程名称验证“身份证号” 文本框验 证 无 效 时 在“汇总验证”控件中显示的错误信息SetFocusO