ajaxpro定时刷新页面

前台页面:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Index.aspx.cs" Inherits="Index" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>交通信号指示</title>
<script language="javascript" type="text/javascript">
window. onerror = function()
{
return true;//不显示脚本错误信息
}

</script>
</head>
<body onload="init()">
<form id="form1" runat="server">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td>路灯状态</td>
</tr>
<tr>
<td>
<div id="timeLabel"><font color="red">红灯</font>
</div>
<div id="test">
</div>
</td>
</tr>
<tr>
<td>请遵守交通法则,做到“红灯停,绿灯行”。</td>
</tr>
</table>

<script language="javascript" type="text/javascript" defer="defer">
function init()
{
setInterval("showTime()",10000);
}
function showTime()
{
var now=new Date();
var time=document.getElementById("timeLabel");
//time.innerText=Index.GetStatus().value;
time.innerHTML=Index.GetStatus().value;
document.getElementById("test").innerHTML=now.toLocaleString();
}
</script>
</form>
</body>
</html>
后台代码:
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
/// <summary>
/// 说明:在Web开发中,有时候需要经常更新某一部分内容,如果不采用Ajax技术,就需要使用传统的html技术,在<head></head>区域加
/// 以下代码:<meta http-equiv="Refresh" content="10"> (假设每10秒更新一次),这样做的缺点是每次更新的时候整个页面都刷新了
/// 带来很多不必要的流量,也影响效率。
/// 微软的Ajax.Net类库也提供了相应的控件,使用微软提供的控件开发效率高,但是经常会出现“***不是已知元素 原因可能是网站中存在编译错误 ”的提示
/// 另外有些控件虽然在执行的时候不占用显示空间,但是在设计视图的时候却占用显示空间,让人心情不爽,所以我还是倾向于AjaxPro这个第三方控件。
/// 不过AjaxPro本身好像没有提供定时执行某个方法的类,但是我们可以利用Js本身的方法,它就是setInterval("方法名()",间隔),没研究微软的
/// Ajax.Net类库,我估计它的最终效果也是采用这个方法或者类似方法来实现的。
/// 作者:周公
/// 时间:2008-3-9
/// 首发地址: http://blog.csdn.net/zhoufoxcn/archive/2008/03/09/2160407.aspx
/// </summary>
public partial class Index : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
AjaxPro.Utility.RegisterTypeForAjax(typeof(Index));//注册AjaxPro
}
//[AjaxPro.AjaxMethod]表示下面的方法用Ajax调用的服务器端方法
[AjaxPro.AjaxMethod]
public string GetStatus()
{
int second = DateTime.Now.Second;
if (second >= 40)
{
return "<font color='red'>红灯</font>";
}
else if (second <= 39 && second >= 20)
{
return "<font color='green'>绿灯</font>";
}
else
{
return "<font color='yellow'>黄灯</font>";
}
}
}
程序运行的效果:

------------------------------------------

――――――――――――――――――――――――――――――――――――

你可能感兴趣的:(Ajax,职场,休闲,ajaxpro)