asp.net利用ajax实现无刷新页面

首先看看Ajax的概念,即“Asynchronous JavaScript and XML”(异步JavaScript和XML),AJAX并非缩写词,而是由Jesse James Gaiiett创造的名词,是指一种创建交互式网页应用的网页开发技术。

简单的介绍之后,进入正题。

今天主要用Timer控件来完成这个功能。

所谓Timer控件,通过引发 Timer 事件,Timer 控件可以有规律地隔一段时间执行一次代码。(说明:Timer 控件用于背景进程中,它是不可见的。)

简单的Timer控件例子(到60分钟后提示吃饭时间到了)
timer1.Enabled = true;
timer1.Interval=3600000;//以毫秒为单位
private void timer1_Tick(object sender, EventArgs e)
{
MessageBox.Show("吃饭时间到了");
}

Timer控件主要会用到2个属性一个是Enabled和Interval
Enabled主要是控制当前Timer控件是否可用
timer1.Enabled=false;不可用
timer1.Enabled=true;可用
timer1.Interval=3600000;主要是设置timer1_Tick事件的时间,单位为毫秒

补充:Timer控件通俗来说就是计时器,这是一个不可视控件.它的重要属性有Interval,Enabled.
它的Tick事件指的是每经过Interval属性指定的时间间隔时发生一次.
 
打开vs2008新建一个页面
 
1.到工具箱里,展开Ajax Extensions。添加ScriptManager控件到页面上。( ScriptManager控件用来处理页面上的所有组件以及页面局部更新,生成相关的客户端代理脚本以便能够在 JavaScript中访问 Web Service,所有需要支持 ASP.NET AJAXASP.NET页面上有且只能有一个 ScriptManager控件。  ScriptManager控件的EnablePartialRendering 属性:true-实现页面的异步局部更新;false-实现全页面的刷新。)
 
2.随后,添加UpdatePanel控件(简单介绍下UpdatePanel控件的个别属性, UpdateMode 属性:Always-UpdatePanel页面上任何一处发生的回发操作都会产生页局部更新;Conditional-只在特定的情况下才产页面的回发,如执行UpdatePanel控件的update()方法或在指定的触发器的操作下。)
 
3. 在UpdatePanel控件内单击并双击Timer控件添加到UpdatePanel中。Timer控件可以作为UpdatePanel的触发器不管是否在UpdatePanel中。
 
设置Interval属性为1000。Interval属性的单位是毫秒,所以设置为1000,相当于1秒钟刷新一次。以此类推。
 
4.接着,只要把需要进行刷新的空间拖放到UpdatePanel里就行了。
 
 
5.为了更好的对比, 我们再添加一个label2在UpdatePanel控件外

 
6.双击Timer1进行代码编写,简单的写个直观明了的测试程序。 在事件处理中设置Label1的Text属性为当前时间。
    protected void Timer1_Tick(object sender, EventArgs e)
    {
        Label1.Text = "Panel refreshed at: " + DateTime.Now.ToLongTimeString();
    }

7.在Page_Load事件中添加代码设置Label2的Text属性为页面创建时间。

    protected void Page_Load(object sender, EventArgs e)
    {
        Label2.Text = "Page created at: " + DateTime.Now.ToLongTimeString();
    }

8.保存,测试,打开网页后,过3秒钟(这里我设置的Interval为3秒)可以看到Panel刷新,里面的Label文字改变为刷新的时间而外面的Label没有改变。形成了对比。参看效果图。

转载于:https://www.cnblogs.com/LovelyOu/archive/2013/05/30/3107429.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值