1、单元单元8 8:创建无刷新网页创建无刷新网页WEB 应应 用 开开 发发WEB 应应 用 开开 发发任务2:利用AJAX实现局部刷新WEB 应应 用 开开 发发WEB 应应 用 开开 发发主要内容ScriptManager控件1UpdatePanel控件2Timer控件3UpdateProgress控件4学习目标技术应用背景一、子任务1:局部刷新改变字体大小 输入字符大小调整字符大小二、基本知识与技能ASP.NET AJAX服务器控件二、基本知识与技能ASP.NET AJAX服务器控件二、基本知识与技能ScriptManager控件三、子任务1的实施三、子任务1的实施 字符的大小(px)三、子
2、任务1的实施namespace Task8-2 public partial class ScriptManager:System.Web.UI.Page protected void TextBox1_TextChanged(object sender,EventArgs e)try Label1.Font.Size=FontUnit.Point(int.Parse(TextBox1.Text);catch(Exception err)Response.Write(错误);四、子任务2:UpdatePanel局部更新方式五、子任务3:UpdatePanel外部触发器六、基本知识与技能Upda
3、tePanel控件六、基本知识与技能UpdatePanel工作原理 六、基本知识与技能UpdatePanel常用子标签六、基本知识与技能UpdatePanel属性属性说明ChildrenAsTriggers当当UpdateMode属性为属性为Conditional时,时,UpdatePanel中的子中的子控件的异步回送是否会引发控件的异步回送是否会引发UpdatePanle的更新。的更新。RenderMode表示表示UpdatePanel最终呈现的最终呈现的HTML元素。元素。Block(默认)表(默认)表示示,Inline表示表示UpdateMode表示表示UpdatePanel的更新模式,
4、有两个选项:的更新模式,有两个选项:Always和和Conditional。当当UpdateMode=Always时,只要页面上引发时,只要页面上引发了异步回发(包括别的了异步回发(包括别的UpdatePanel内的控件),就会更内的控件),就会更新。当新。当UpdateMode=Conditional时,是否更新取决于时,是否更新取决于UpdatePanel的设置。默认情况下,仅自己内部的控件引发的设置。默认情况下,仅自己内部的控件引发的回发才会更新。的回发才会更新。七、子任务2的实施七、子任务2的实施 局部更新方式 当UpdateMode=Always时,只要页面上引发了异步回发,就会更新
5、。当UpdateMode=Conditional时,是否更新取决于UpdatePanel的设置。整页更新时间:七、子任务2的实施 UpdateMode:Always 局部可更新区域一的更新时间:UpdateMode:Conditional 局部可更新区域二的更新时间:UpdateModel.aspxUpdateModel.aspx代码代码八、子任务3的实施八、子任务3的实施 外部触发器的定义与使用 当UpdateMode=Always时,只要页面上引发了异步回发,就会更新。当UpdateMode=Conditional时,是否更新取决于UpdatePanel的设置。整页更新时间:UpdateM
6、ode:Always 局部可更新区域一的更新时间:由于UpdateMode是Always,所以任意一个异步回发都会导致自己被更新。八、子任务3的实施 UpdateMode=Conditional同时ChildrenAsTriggers=false 设置其外部触发器为UpdatePanel1里面的Button 由于ChildrenAsTriggers=false,所以下面这个按钮会引发异步回发,但不会更新自己。局部可更新区域二的更新时间:由于其外部触发器为UpdatePanel1里面的Button 因此点击第一个UpdatePanel1里面的Button会更新此面板。九、子任务3的拓展十、子任务
7、4:使用Timer控件十一、基本知识与技能 EnabledEnabled:是否是否启启用用TickTick时间时间引引发发。IntervalInterval:设设置置TickTick事件之事件之间间的的连续时间连续时间,单单位位为为毫秒。毫秒。十一、基本知识与技能十二、子任务4的实施十二、子任务4的实施 使用Timer控件定时取出服务器时间 服务器当前时间:十三、子任务5:使用UpdateProgress控件 正在操作中操作完成后十四、基本知识与技能UpdateProgress控件 正在操作中,请稍后.十四、基本知识与技能UpdateProgress控件十四、基本知识与技能UpdateProg
8、ress控件十五、子任务5的实施十五、子任务5的实施 使用UpdateProgress控件 正在操作中,请稍后.UpdateProgress.aspxUpdateProgress.aspx代码代码十五、子任务5的实施namespace ajax1 public partial class UpdateProgress:System.Web.UI.Page protected void Page_Load(object sender,EventArgs e)protected void Button1_Click(object sender,EventArgs e)System.Threading.Thread.Sleep(5000);Label1.Text=操作完成!;UpdateProgress.aspx.csUpdateProgress.aspx.cs代码代码十六、小结通过学习本单元的内容可以掌握ASP.NET中AJAX服务器控件的使用。虽然AJAX包括诸多功能和特性,但是AJAX也增加了服务器负担,如果在服务器中大量使用AJAX控件的话,有可能造成服务器假死,熟练和高效的编写AJAX应用对AJAX Web应用程序开发是非常有好处的。十七、作业Thank You!