8.1网页中的控件类型
- 格式:doc
- 大小:380.00 KB
- 文档页数:20
1按钮控件1.1如何使用按钮控件方法是双击编辑对话框按钮图标,之后就进入了这个按钮单击的处理函数,在这里,你可以添加按钮单击后要做的事是什么.1.2如何让按钮显示图标样式首先进入ResourceView里,然后右击Icon选择插入,之后选择你要的图标,假设这个图标的ID名为IDI_ICON2,那么下一步,就是进入对话类中的OnPaint()函数,并在else里面添加如下语句:m_Quit.SetIcon(LoadIcon(AfxGetResourceHandle(),MAKEINTRESOURCE(IDI_ICON2)));注:m_Quit为要显示图标按钮的关联类;还要说明的是,必须把按钮属性样式里把图标的构给打上才行,要不然是无法显示图标的。
1.3如何让按钮显示文本信息先要在对话框添加一个CToolTipCtrl类的对象,如:CToolTipCtrl m_ToolTip;然后在OnInitDialog添加以下语句:m_ToolTip.Create(this);m_ToolTip.AddTool(&m_Confirm,”文本信息”);//m_Confirm为要显示文本按钮关联的类对象然后在类视图窗口中右击对话框类,在弹出的菜单中选择Add Virtual Funtion,然后再双击PreTranslateMessage;添加右边窗口中去,这样便增加了一个方法,在此方法中添加以下语句m_ToolTip.RelayEvent(pMsg);既可;2.1如何使用复选框控件复选框控件是有一个X的图标,比如是三个复选框吧,首先各为三个复选框关联一个控件类,比如是m_Vip,m_Manager,m_Commoner;那么调用m_Vip.GetCheck();返回的是一个整数,如果返回值等于BST_CHECKED;那么此类关联的复选框控件就被选中了。
如果要获取此类关联控件的文本信息就用m_Vip.GetWindowText(Modal);其中Modal是一个CString类的对象,跟Edit是差不多的,存储有信息。
4.1 概述ADO Data 控件使用Microsoft ActiveX 数据对象(ADO) 来快速建立数据绑定的控件和数据提供者之间的连接。
Visual Basic以前的版本提供了内在的Data 控件和Remote Data 控件(RDC) 来进行数据访问。
这两种控件仍包括在Visual Basic 中,以提供向后兼容。
不过,因为ADO 的适应性更广,因此建议用户使用ADO Data 控件来创建新的数据库应用程序。
请注意,这种控件是一种相当“昂贵”的创建连接的方法,在第一个控件至少有两个连接,且以后的每个控件至少多一个连接时使用。
可能的用法:连接一个本地数据库或远程数据库。
打开一个指定的数据库表,或定义一个基于结构化查询语言(SQL) 的查询、或存储过程、或该数据库中的表的视图的记录集合。
将数据字段的数值传递给数据绑定的控件,可以在这些控件中显示或更改这些数值。
添加新的记录,或根据对显示在绑定的控件中的数据的任何更改来更新一个数据库。
∙ 4.2 用法∙如果该控件不在“工具箱”中,请按CTRL+T 键,显示“部件”对话框。
在这个“部件”对话框中,单击“Microsoft ADO Data Co ntrol”。
∙在“属性”窗口中,单击“ConnectionString”显示“ConnectionString”对话框。
如果您已经创建了一个Microsoft 数据链接文件(D ata Link file)(.UDL),请选择“使用OLE DB 文件”并单击“浏览”,以找到计算机上的文件。
如果使用DSN,则单击“使用OD BC 数据源名”,并从框中选择一个DSN,或单击“新建”创建一个。
如果想创建一个连接字符串,请选择“使用ConnectionString”,单击“生成”,然后使用“数据链接属性”对话框创建一个连接字符串。
在创建连接字符串后,单击“确定”。
∙在“属性”窗口中,将“记录源”属性设置为一个SQL 语句。
4.6.发光特效-数字风暴实训步骤
知识点
1.粒子特效
2.发光特效
3.投影特效
操作步骤
新建合成
01执行菜单栏中的合成/新建合成命令,打开合成设置对话框,设置合成名称为数字,宽度为720,高度为480,帧速率为25,并设置持续时间为0:00:02:00
02利用文本工具,在合成窗口中输入数字六,设置文字的字体为方正粗倩简体,文字的颜色为白色,文字的大小为60像素。
创建粒子特效
01.执行菜单栏中的合成/新建合成命令,打开合成设置对话框,设置合成名称为粒子,宽度为720,高度为480,帧速率为25,并设置持续时间为0:00:02:00
02将数字拖动到粒子合成,并将数字合成左侧的显示开关关闭。
按ctrl+y组合键打开纯色设置对话框,修改名称为粒子,设置颜色为黑色。
03.在效果和预设特效面板中展开Trapcode特效组,双击粒子特效。
04.在效果控件面板中,展开发射器选项组,设置每秒发射粒子数的值为500,随机速度的值为82,Velocity from Motion的值为十。
Win8.1 Update新增功能大搜罗导读:继windows8.1 update春季更新版的推出后,微软又如期地向用户推送了windows8.1 update的更新补丁,向用户展示了全新的功能改进以及新增了不少实用的功能。
究竟是怎样的改变呢?很多用户都非常好奇,现在就让我们一起去详细解读下win8.1 update的这些新增功能,满足一下用户的好奇心。
解读windows8.1 update的新增功能:1、获取更新如果你已运行Windows 8.1或Windows RT 8.1,则Windows 8.1更新和Windows RT 8.1更新可通过Windows Update免费获取。
2、更轻松地访问你喜欢的应用和关键控件开始屏幕上的“电源”和“搜索”按钮。
这些按钮显示在用户头像旁边的“开始”屏幕的右上角。
你将能够快速且轻松地关闭电脑,或直接从“开始”屏幕搜索内容。
(某些类型的电脑在“开始”屏幕上没有“电源”按钮。
你可以改为使用“设置”超级按钮中的“电源”按钮关闭电脑。
)有关详细信息,请参阅关闭电脑(关机),或使其进入睡眠或休眠状态和如何搜索。
所有打开和固定的应用均显示在任务栏中。
如果你使用的是桌面,你将同时在任务栏中看到桌面应用和Windows应用商店中的应用(当它们运行时)。
你也可以将任何应用固定到任务栏,以便可以在桌面中快速打开应用并在应用之间快速切换。
从任意位置访问任务栏。
如果你使用的是鼠标,则可以从任何屏幕(包括“开始”屏幕或Windows应用商店应用)查看任务栏。
将鼠标指针移动到屏幕的底部边缘下方以显示任务栏,然后单击某个应用以打开或切换到它。
登录时转到桌面,而非“开始”屏幕。
如果你在桌面上花费太多时间,则可以直接登录(启动)到桌面,而非“开始”屏幕。
相反,如果你希望登录到“开始”屏幕,则可以随时更改此设置。
3、更为熟悉的鼠标和键盘选项“最小化”按钮、“关闭”按钮和任务栏与鼠标操作更加一致。
ASP NET动态网页设计与制作教案第一章:ASP NET概述1.1 ASP NET简介1.2 ASP NET的发展历程1.3 ASP NET的核心技术1.4 安装和配置IIS第二章:C语言基础2.1 C语言简介2.2 C基本语法2.3 数据类型2.4 控制结构第三章:HTML与CSS3.1 HTML基础3.2 HTML标签3.3 CSS简介3.4 CSS样式第四章:ASP NET控件与事件4.1 常用ASP NET控件4.2 控件属性与事件4.3 数据绑定4.4 验证控件第五章:数据库连接与操作5.1 数据库基础知识5.2 SQL语言5.3 技术5.4 数据库连接与操作实例第六章:ASP NET页面生命周期与状态管理第七章:ASP NET MVC框架第八章:Web服务与AJAX技术第九章:LINQ技术第十章:身份认证与授权第十一章:文件与第十二章:XML与JSON数据处理第十三章:Web应用部署与优化第十四章:网络安全与防护第十五章:项目实践与案例分析第六章:页面生命周期与状态管理6.1 页面生命周期概述6.2 Page类的重要属性和方法6.3 页面状态管理6.4 页面事件处理第七章: MVC框架7.1 MVC框架简介7.2 MVC架构模式7.3 创建MVC控制器7.4 处理请求第八章:Web服务与AJAX技术8.1 Web服务概述8.2 创建 Web服务8.3 AJAX技术简介8.4 使用AJAX技术与Web服务交互第九章:LINQ技术9.1 LINQ基础9.2 LINQ to Objects9.3 LINQ to XML9.4 LINQ to SQL第十章:身份认证与授权10.1 身份认证概述10.2 基于窗体的身份认证10.3 基于角色的授权10.4 使用 Identity进行身份认证和授权第十一章:文件与11.1 文件概述11.2 实现文件功能11.3 文件概述11.4 实现文件功能第十二章:XML与JSON数据处理12.1 XML基础12.2 XML解析12.3 JSON基础12.4 JSON解析与使用第十三章:Web应用部署与优化13.1 部署概述13.2 部署准备13.3 部署到不同环境13.4 性能优化第十四章:网络安全与防护14.1 网络安全基础14.2 常见攻击手段与防护14.3 身份验证与授权14.4 数据加密与安全传输第十五章:项目实践与案例分析15.1 项目实践流程15.2 项目需求分析15.3 项目设计与实现15.4 项目测试与部署重点和难点解析重点:1. 的核心技术及其在动态网页制作中的应用。
js中的时间控件WdatePicker.txt世上最珍贵的不是永远得不到或已经得到的,而是你已经得到并且随时都有可能失去的东西!爱情是灯,友情是影子。
灯灭时,你会发现周围都是影子。
朋友,是在最后可以给你力量的人。
js中的时间控件WdatePickerMy97日期控件 My97 DatePicker Ver 3.0.13.0.1修正的问题1.修正与很多JS库(如prototype,JQuery,dwr等)的冲突问题2.解决不能“后退”的问题3.解决IE6中,今天和选中的日期没有以其它颜色显示的问题4.解决日期选择器被动态增加的iframe覆盖的问题一. 注意事项和简介1. 注意事项1. My97DatePicker目录是一个整体,不可破坏里面的目录结构,也不可对里面的文件改名,可以改目录名2. My97DatePicker.htm是必须文件,不可删除3. 各目录及文件的用途:WdatePicker.js(导入文件,在调用的地方仅需使用该文件)config.js(主配置文件) calendar.js(日期库主文件) My97DatePicker.htm(临时页面文件) 目录lang(存放语言文件) 目录skin(存放皮肤的相关文件)4. 在input里加上class="Wdate"就会在选择框右边加上日期图标,如果你不喜欢这个样式,可以把class="Wdate"去掉,另外也可以通过修改skin目录下的WdatePicker.css文件来修改样式2. 更新和修正的内容1.优化了速度和内存占用2.增加realValue 的格式设置3.增强日期范围限制可以使用#Year# #Month# #Day# #lastDay#如:本月最后一天#Year#-#Month#-#lastDay#明年今天(注意有运算的地方,比如+1,必须用{}) : {#Year#+1}-#Month#-#Day#函数 #F{function}比如用另一个框(id是test1)的值作为最小日期,则 MINDATE="#F{$('test1').value}"4.当日期格式设置为 %h:%m:%s 只有时间选择了5.增加年份月份导航,增加清空按钮6.增加显示位置设置(上面下面自动(默认))7.增加文件包路径设置(在wdatepicker.js文件里,默认为空,程序会自动计算路径)8.增加自定义触发事件,可以在日期框添加属性 onpicked="function(){}" 来自定义触发事件9.增加多语言自动选择功能,系统会根据用户浏览器语言自动选择简体繁体和英文修正抖屏修正在XHTML 1.0下不兼容的问题修正2007-3-31 修改成2月份时变为2007-2-31的bug修正frame中跳转时没销毁的bug修正css路径,不必将文件包放根目录下了二. 功能介绍1. 自动切换语言(新增)日期控件会根据用户的浏览器语言自动切换,自带3中语言,简体中文,繁体中文和英文相关配置文件在 lang目录2. 支持自定义皮肤和动态切换皮肤默认皮肤default:即skin=default 主调函数:onfocus="new WdatePicker(this)"示例2-1:whyGreen皮肤:即skin=whyGreen 主调函数:onfocus="new WdatePicker(this,null,false,'whyGreen')"注意:'whyGreen'要带上单引号,因为是字符串示例2-2:3. 自定义事件(onPicked)(新增)事件名称:onPicked 事件触发条件:选择日期的时候示例:利用onPicked实现日期选择联动(选择第一个日期的时候,第二个日期选择框自动弹出)<input class="Wdate" type="text" id="hts" onfocus="new WdatePicker(this,'%Y年%M 月%D日',false)" maxdate="#F{$('hte').value}" onPicked="$('hte').onfocus()"/> 注: hte 是后面那个选择框的id合同有效期从到4.日期范围限制(增强)4.1 日期范围限制(静态限制,日期格式必须与config.js中的realValueShortFmt一致) 相关属性:MINDATE(最小日期) MAXDATE(最大日期)<input class="Wdate" type="text" onfocus="new WdatePicker(this)" MINDATE="2006-10-8" MAXDATE="2008-12-20"/>示例 4.1-1(限制日期的范围是 2006-10-8到2008-12-20 ):4.2 日期范围限制(动态限制)相关属性:MINDATE(最小日期) MAXDATE(最大日期)动态变量: #Year#(今年) #Month#(本月) #Day#(今天) #lastDay#(本月最后一天)如#Year#-#Month#-#Day#(表示今天) #Year#-#Month#-{#Day#+1}(表示明天) {#Year#+1}-#Month#-#Day#(表示明年的今天)注意:如果有运算的地方必须用{}括起来,如上面例子的{#Day#+1},必须用{}自定义函数: #F{}表示函数,{}之间是函数的内容例子见4.2-1示例 4.2-1(动态限制日期的范围使用了自定义函数前面的日期不能大于后面的日期后面的日期的最大值是:2020-1-1):<input class="Wdate" id="htStart" type="text" onfocus="new WdatePicker(this,'%Y 年%M月%D日',false)" MAXDATE="#F{$('htEnd').value}"/><input class="Wdate" id="htEnd" type="text" onfocus="new WdatePicker(this,'%Y年%M 月%D日',false)" MINDATE="#F{$('htStart').value}" MAXDATE="2020-1-1"/>合同有效期从到示例 4.2-2(动态限制日期的范围只能选择今天以前的日期(包括今天))<input class="Wdate" id="text212" type="text" onfocus="new WdatePicker(this)" MAXDATE="#Year#-#Month#-#Day#"/>示例 4.2-3(动态限制日期的范围只能选择今天以后的日期(不包括今天))<input class="Wdate" id="text213" type="text" onfocus="new WdatePicker(this)" MINDATE="#Year#-#Month#-{#Day#+1}"/>示例 4.2-4(动态限制日期的范围只能选择本月的日期 1号至本月最后一天)<input class="Wdate" id="text213" type="text" onfocus="new WdatePicker(this)" MINDATE="#Year#-#Month#-1" MAXDATE="#Year#-#Month#-#lastDay#"/>5. 根据网页大小自动选择显示位置调用形式同示例1-1,点右下角的日期框就能看到效果示例5-1:67. 支持日期和时间的编辑,编辑时自动跳转到对应月份和时间不知道你是否已经注意到,当日期框里面有值时,右下角的按钮会变成确定,现在你可以尝试对下面框中的日期和时间进行编辑主调函数:onfocus="new WdatePicker(this)"示例5-1:主调函数:onfocus="new WdatePicker(this,'%Y-%M-%D %h:%m:%s',true)"示例5-2:8. 支持自定义时间和日期格式(增强)8.1 年月日时分秒主调函数:onfocus="new WdatePicker(this,'%Y年%M月%D日 %h时%m分%s秒',true)"示例8-1:那么像这样的文本框我们存入数据库时这么取得实际的日期值呢,别急,用这个函数document.getElementByIdx_x('textbox2').getValue()8.2 时分秒主调函数:onfocus="new WdatePicker(this,'%h:%m:%s',true,'whyGreen')"示例8-2:8.3 年月主调函数:onfocus="new WdatePicker(this,'%Y年%M月',false,'whyGreen')"示例8-2:8.4 年月日时分主调函数:onfocus="new WdatePicker(this,'%Y-%M-%D %h:%m',true)"示例8-2:9. 增强的自动纠错功能,纠错处理可设置为3种模式 1.提示(默认) 2.自动纠错 3.标记您可以在下面的日期框中填入一个不合法的日期(如:1997-02-29),再尝试离开焦点示例9-1另:超出日期限制范围的日期也被认为是一个不合法的日期示例9-2的最大日期是2000-1-10 ,如果在下框中填入的日期大于 2000-1-10(如2000-1-12)也会被认为是不合法的日期<input class="Wdate" type="text" onfocus="new WdatePicker(this)" MAXDATE="2000-1-10"/>示例9-210. 完美支持FireFox您可以使用FireFox浏览其来浏览此页来查看效果三. 配置说明$position = 0;$dpPath = '';var dpcfg = {};dpcfg.skin = "default";dpcfg.dateFmt = "%Y-%M-%D";dpcfg.realValueShortFmt = "%Y-%M-%D";dpcfg.realValueLongFmt = "%Y-%M-%D %h:%m:%s";dpcfg.showTime = false;dpcfg.highLineWeekDay = true;dpcfg.minDate = "1900-1-1";dpcfg.maxDate = "2099-12-30";dpcfg.errDealMode = 0;dpcfg.errAlertMsg = "不合法的日期格式或者日期超出限定范围,需要撤销吗?";dpcfg.aWeekStr = ["日","一","二","三","四","五","六"];dpcfg.aMonStr = ["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一","十二"];dpcfg.clearStr = "清空";dpcfg.todayStr = "今天";dpcfg.okStr = "确定";dpcfg.timeStr = "时间";.Wdate{border:#999 1px solid;height:18px;background:url(datePicker.gif) no-repeat right;}.WdateFmtErr{font-weight:bold;color:red;}四. 如何使用1. 在使用该日期控件的文件中加入JS库(仅这一个文件即可,其他文件会自动引入,请勿删除或改名), 代码如下<script language="javascript" type="text/javascript" src="datepicker/WdatePicker.js"></script>注:src="datepicker/WdatePicker.js" 请根据您的实际情况改变路径2.加上主调函数 onfocus="new WdatePicker('el','dateFmt','showsTime','skin')"相信大家已经知道怎么用了,如果还不明白请QQ我:9589876主调函数的使用方法和说明1.主调方法:onfocus="new WdatePicker('el','dateFmt','showsTime','skin')"这个是JS库的主调函数:el: 表示返回日期的对象或对象名称,提供2种调用方式dateFmt: 自定义的日期格式 %Y %M %D %h %m %s 表示年月日时分秒(注意大小写) 默认是%Y-%M-%DshowsTime: 布尔型变量 true表示带时间选择默认为falseskin: 皮肤的名称本包自带2款皮肤分别为 default 和 whyGreen2.属性(注意大小写,日期格式必须与config.js中的realValueShortFmt一致) MINDATE: 日期最小值格式为: 2000-1-1 或 2000/1/1 默认为:1900-1-1MAXDATE: 日期最大值格式为: 2008-1-1 或 2008/1/1 默认为:2099-12-303 取值的方法(注意:返回值的格式在config.js中的realValueShortFmt realValueLongFmt 中定义)getValue(): 这个属性用于记录日期框的日期值通常情况下getValue()和日期框的value 属性是一样的,当进行自定义日期格式的时候这2个值就不一样了例如: 当格式字符串: %Y年%M月%D日 %h时%m分%s秒时日期框中的VALUE是:2000年1月1日 12时00分00秒而getValue()值: 2000-1-1 12:00:00我想通过这个例子应该很清楚了,2000年1月1日 12时00分00秒对于用户来说是一个很直观的日期,但对于计算机来说是一个不可识别的日期,在用户选择的时候我们可以使用%Y 年%M月%D日 %h时%m分%s秒格式化日期给用户一个友好的日期格式,但是在数据存储的时候我们不可能把2000年1月1日 12时00分00秒直接存入数据库的,getValue()就是为了解决这个问题而设计的.。
2005.4(30)以下可以得到“2*5=10”结果的VBA表达式为A) “2*5”&“=”&2*5B) “2*5”+“=”+2*5C) 2*5&“=”&2*5D) 2*5+“=”+2*5字符串常量加双引号,数值不加双引号&连接符与+连接符的区别,&强制连接,可以用于字符串与数字之间;+只能连接两个字符串2005.4(33) 以下程序段运行后,消息框的输出结果是a=sqr(3)b=sqr(2)c=a>b·····c为true,即-1Msgbox c+2A) -1 B) 1 C) 2 D) 出错2005.9(31) 下列逻辑表达式中,能正确表示条件“x和y都是奇数”的是A)x Mod 2 =1 Or y Mod 2 =1 B)x Mod 2 =0 Or y Mod 2=0C)x Mod 2 =1 And y Mod 2 =1 D)x Mod 2 =0 And y Mod 2=02005.9(填8)函数Now( )返回值的含义是系统当前的日期和时间2006.4(29) VBA程序的多条语句可以写在一行中,其分隔符必须使用符号A.:B.’C.;D.,2006.4(30) VBA表达式3*3\3/3的输出结果是A.0 B.1 C.3 D.9符号优先级:加减号< mod < \ < 乘号、除号(8.1PPT)2006.9(25) 在已建雇员表中有“工作日期”字段,下图所示的是以此表为数据源创建的“雇员基本信息”窗体。
假设当前雇员的工作日期为“1998-08-17”,若在窗体“工作日期”标签右侧文本框控件的“控件来源”属性中输入表达式:=Str(Month([工作日期]))+”月”,则在该文本框控件内显示的结果是Month year day这些函数返回的值是数值类型,数值只有1/2/3···没有01/02/03;Str函数将数值8转换为字符串:“8”(前面有一个空格)+把两个字符串连接到一起A)Str(Month(Date( )))+”月” B)”08”+”月”C)08月D)8月2006.9(30) (30)在窗体中添加一个命令按钮(名称为Command1),然后编写如下代码:Private Sub Command1_Click( )a=0: b=5: c=6MsgBox a=b+cEnd Sub窗体打开运行后,如果单击命令按钮,则消息框的输出结果是A)11 B)a=11 C)0 D)False2007.4(11)在VBA编程中检测字符串长度的函数名是len 。
第8章 网页标准控件 控件是一种类,绝大多数控件都具有可视的界面,能够在程序运行中显示出其外观。利用控件进行可视化设计既直观又方便,可以实现“所见即所得”(What You See Is What You Get,简称为WYSIWYG)的效果。程序设计的主要内容是选择和设置控件以及对控件的事件编写处理代码。 本章将介绍网页中最常用的几个标准网页控件。目的在于学会这些常用控件的使用方法。其他控件在后续的章节中介绍。
8.1网页中的控件类型 ASP.NET的类库中包括大量的控件,根据功能可以将它们分成以下几种类型。 标准控件:这些控件属于服务器控件。除窗体页中常用的按钮、文本框等控件以外,还有一些特殊用途的控件,例如,显示日历的控件等。网页标准控件与HTML元素标记之间不存在一对一的对应关系。 验证控件:用于检验用户的输入。例如,验证是否缺少必须填入的字段;输入的数据格式是否符合要求;输入的数据是否在指定的范围内等。 用户控件及自定义控件:这些控件都是由程序设计者自行定义的控件,是对系统控件的扩展。用户控件可以在项目内不同网页中重复使用,从而提高了程序设计的效率,同时还能使各网页的显示风格一致。 HTML控件:默认情况下它属于客户端(浏览器端)控件,但也可以将其转换成服务器端控件。每个控件对应于一个HTML元素的标记。 数据源控件 这类控件可以针对各种数据源实现数据绑定功能,这包括微软的SQL Server和Access,以及其他关系型数据库、XML文件和代码中实现的类。 数据视图控件 这类控件呈现为各种列表和表格,它们可以绑定到数据源以显示和编辑数据。 个性化控件 这类控件允许用户个性化地展示自己的站点,包括重新调整网页本身等。用户信息会被自动地、透明地保存,并从一个会话持续到下一个会话。 登录控件和安全控件 这类控件实现站点中的普通登录功能,并维护用户的密码。 组合控件:由多个标准控件组合而成,能够完成如客户认证等比较复杂的功能。 ASP.NET 2.0增加了近60个控件,其中有不少是功能强大的组合控件,从而大大提高了快速开发的能力。
8.2 HTML控件转换成服务器控件 HTML控件是从基类 System.Web.UI.HtmlControls.HtmlControl 直接或间接派生的类,并且都直接映射到 HTML 元素上。默认情况下HTML控件属于浏览器端控件,服务器无法控制。这些元素被视为传递给浏览器的不透明的文本。这些不透明的文本被传送到浏览器后由浏览器下载并负责解释、执行。 但是,为了适应ASP.NET应用的需要,可以将 HTML 元素转换成 HTML 服务器控件,从而在服务器端对它们进行编程和处理。 将HTML 控件转换成服务器控件非常简单。下面举例说明。 例如,想将一个Text Field浏览器端控件转换成服务器端控件,转换的方法如下: 用手工方法在控件的定义中增加runat="server"属性,该控件就变成了服务器端控件。如果原来的HTML控件中没有id属性时,也应该补上。增加上述属性后,控件的定义如下:
HTML控件的功能在前面HTML章节中已经详细介绍,这里不再作讨论 8.3网页标准控件功能和格式
在ASP.NET 2.0的【工具箱】中,只有HTML选项卡中的控件是浏览器端控件,其他各种控件都是服务器控件。其中【标准】选项卡中的控件是常用的控件。在类库中,所有的网页控件都是从System.Web.UI.Control.WebControls直接或间接派生而来的。
1.网页标准控件的功能
在【工具箱】的【标准】选项卡中包括有几十个标准控件。这些控件中既有传统的窗体控件,例如,按钮、选择控件、文本框等,还有用来显示数据、选择日期等比较复杂的控件。其中,有的控件还具有很高的智能,例如: 能自动检测浏览器的类型,并根据浏览器的类型提供不同的输出。 能够使用模板来定义控件的外观。 可以选择事件信息传送的方式,是立即发送给服务器,还是先缓存然后再和其他信息一起传送给服务器。 有的控件可将事件信息从嵌套控件(例如表中的按钮)传递到它的容器控件。
2.定义标准控件的格式
定义网页标准控件的格式如下: 其中asp代表命名空间,所有的Web服务器控件的命名空间都是asp;Control代表控件的类型;id代表控件的标志;runat="server"代表这是一个服务器控件,默认情况下,所有标准控件都是服务器控件。 例如,定义Label、TextBox、Button等网页控件的代码如下。
8.4.设置控件的属性和事件处理程序 开发人员通过从“工具箱”窗口拖放控件到设计页面上,并利用属性浏览器为其设置属性和事件。大多数控件都拥有一些共有的属性与事件,例如ID、Text属性以及Click事件等。让我们通过几个简单的控件来熟悉为控件设置属性和添加事件的基本方法。 首先,创建一个ASP.NET 网站,切换到Default.aspx页面的“设计”视图,从“工具箱”的“标准”组中将一个Label控件拖放到页面上。右击该控件,在菜单中选择【属性】,展开“属性”窗口(图11-1)。 在设置Label控件的属性前,先对“属性”窗口做一个了解。 图11-2中标出了“属性”窗口中最上面一行的四个按钮的作用。靠左边的两个按钮用于指定属性和事件排序的方式,通常使用按字母顺序排列便于查找。后面的两个按钮则是在属性与事件列表间切换时使用。 接下来,就可以在属性列表中为Label控件设置属性了。图11-3是以Label控件的外观的属性值:BackColor(背景色)、BorderColor(边框颜色)、BorderStyle(边框样式)、BorderWidth(边框宽度)、Font(字体)、ForeColor(前景色)、Height(高度)等为例。
图 11-1 图 11-2 图 11-3 之前在“属性”窗口中所做的设置,也可以在该视图中手动添加。
代码清单 11-1 设置Label控件属性 BackColor="Blue" BorderColor="Yellow" BorderWidth="2px" Font-Bold="True" Font-Names="Verdana" ForeColor="White" >
在本示例中,将Label控件的Text属性设为“请输入您的姓名:”,然后添加TextBox、Button 和另外一个Label控件至页面。选中 Button 控件,在其“属性”窗口中将Text属性值设置为“提交”。更详细的控件属性设置见右侧的表。 其余样式按图11-4布局。
图 11-4
控件 属性名称 属性值 Label ID lbName Text 请输入您的姓名: TextBox ID tbName
Button ID btSubmit Text 提交
Label ID lbResult Text 置空 切换回“源”视图,此时的HTML标记丰富了许多(如图11-5所示)。 图 11-5 所有服务器控件使用“asp:”作为前缀,并包括一个runat=“server”的属性。这表明当页面运行时它们由 ASP.NET 在服务器端进行处理。接下来为Button控件添加处理事件。返回“设计”视图,双击Button控件,或者是选中Button控件,在“属性”窗口中点击事件标
记,双击Click事件右侧的文本框(图11-6)。
此时,集成开发环境将在编辑器的单独窗口中打开Default. aspx.cs文件,其中包含Button按钮的Click 事件处理程序框架,键入如下代码: 代码清单 11-2
protected void btSubmit_Click(object sender, EventArgs e) { lbResult = tbName.Text + ",欢迎您!"; }
现在按下Ctrl + F5在浏览器中运行该页。在文本框中输入名称并单击提交按钮。输入的名称将显示在Label控件中(图11-7)。
图 11-7 8.5.标准控件介绍 标准的服务器控件的作用比较广泛,本节重点介绍标准控件中常用控件的使用方法和技巧。
(1) 标签控件
Label标签控件是最简单的控件,该控件的功能就是输出文本。向Web窗体页添加Label服务器控件步骤如下: 1.从工具箱的“标准”选项卡中,将 Label 控件拖到页面上。 2.在“属性”窗口的“外观”类别中,将该控件的 Text 属性设置为要显示的文本。 文本也可以利用程序动态地设定。定义的语法如下: 输出文本 或 其中:“asp”为标准控件区别于HTML控件而添加的标记,在使用标准控件时,每个控件名称前都必须加上“asp”; 可以在文本属性中包括HTML标记,例如,在 Text 属性中,可以通过在文本中放置标记来对文本加粗。
Label1.Text = "Label标签控件"; 运行程序后,文本“Label标签控件”加粗显示,这表明Label控件文本属性中的HTML标记是要被解释的。
(2) 文本框控件
TextBox文本框控件为用户提供了一种向网页中输入信息(包括文本、数字和日期)的方法。定义的格式如下: runat="server" /> TextBox控件有一个重要的属性:TextMode。该属性包括3个选项。 SingleLine:单行编辑框; MultiLine:带滚动条的多行文本框; PassWord:密码输入框,所有输入字符都用特殊字符(例如“*”)来显示。 Maxlength属性设置TextBox控件可以接收的最大字符数。
(3) 按钮控件
标准控件中提供了三种按钮:普通按钮(Button)、超链接按钮(LinkButton)和图片按钮(ImageButton)。它们之间功能相同,只有外观上有区别。Button的外观与传统按钮的外观相同;LinkButton的外观与超链接字符串相同;ImageButton按钮用图形方式显示外观,其图像通过ImageURL属性来设置。 三种按钮的功能都与HTML的提交按钮(Submit Button)相似,即每当这些按钮被单击(Click)时,就将缓冲区中的事件信息一并提交给服务器。 定义按钮的语法如下: