Ajax无刷新实现定时更新数据

最新推荐文章于 2021-08-05 13:42:14 发布

selfxd

最新推荐文章于 2021-08-05 13:42:14 发布

阅读量2.3k

点赞数

分类专栏： AJAX ASP.NET 文章标签： ajax server timer asp object javascript

本文链接：https://blog.youkuaiyun.com/selfxd/article/details/2514618

版权

ASP.NET 同时被 2 个专栏收录

34 篇文章

订阅专栏

AJAX

5 篇文章

订阅专栏

本文介绍了两种使用Ajax技术实现在网页上无刷新定时更新数据的方法。第一种通过引用ajax.dll并使用JavaScript定时调用后台方法获取并显示当前时间。第二种方法利用Ajax控件UpdatePanel结合Timer控件，每隔1秒自动刷新GridView展示的数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、引用 ajax.dll 实现走动时间显示来查看效果

前台代码
<script language="javascript" type="text/javascript">
          //定时更新时间
          function refresh()
          {
               var div = document.all("divTime");

               var strTime = Default1.GetAllOnLineUser().value;
               if (strTime != "")
                   div.innerHTML = strTime;

               //1秒钟刷新
               window.setTimeout(refresh, 1000);
          }

</script>
<body>
<form id="form1" runat="server">
    <div id="divTime"></div>
    <script>
        refresh();
    </script>
    </form>
</body>

后台代码：

protected void Page_Load(object sender, EventArgs e)
{
//注册Ajax类型
Ajax.Utility.RegisterTypeForAjax(typeof(Default1));
}

    [Ajax.AjaxMethod()]
    public string GetAllOnLineUser()
    {
        return "当前时间：" + DateTime.Now.ToString();
    }

2、使用 Ajax 控件实现定时刷新数据

HTML代码：
<body>
    <form id="form1" runat="server">
        <div>
            <asp:ScriptManager ID="ScriptManager1" runat="server">
            </asp:ScriptManager>
            <asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="true">
            <ContentTemplate>
                <asp:Timer ID="Timer1" runat="server" OnTick="Timer1_Tick" Interval="1000">
                </asp:Timer>
                <asp:GridView ID="GridView1" runat="server">
                </asp:GridView>
            </ContentTemplate>
            </asp:UpdatePanel>
        </div>
    </form>
</body>

后台代码：
    protected void Page_Load(object sender, EventArgs e)
    {
         ShowAuthors();
    }
    public void ShowAuthors()
    {
        SqlDataAdapter sda = new SqlDataAdapter("select * from authors", "server=.;database=pubs;user=sa;");
        DataTable dt = new DataTable();
        sda.Fill(dt);
        GridView1.DataSource = dt;
        GridView1.DataBind();
    }
    protected void Timer1_Tick(object sender, EventArgs e)
    {
        GridView1.DataBind();
    }