如何每隔一段时间刷新页面的一部分

本文关键字：一部分 刷新 何每隔 一段时间 | 更新日期: 2023-09-27 18:30:00

我有一个页面，上面有一个面板，每5分钟自动刷新一次，如果用户的收件箱中有消息，就会显示给他。对此，最好的解决方案是什么？

我应该使用AJAX、jQuery还是JavaScript？我的首选解决方案是服务器端解决方案。

如何每隔一段时间刷新页面的一部分

由于您使用的是ASP.Net，您还可以通过使用以下各项的组合来实现此行为：

  1. ScriptManager或ScriptManagerProxy（如果您有嵌套页面）：管理ajax调用
  2. UpdatePanel：确定要更新的内容。嵌套在<ContentTemplate>中的控件受部分更新
  3. 触发器：控制何时更新内容

出于您的目的，Timer控件可以用作触发器，以确保每5秒触发一次部分回发：

<asp:ScriptManager ID="scriptManagerMain" runat="server"/>
<asp:Timer ID="timer" Interval="5000" runat="server"/>
<asp:UpdatePanel runat="server">
    <ContentTemplate>
        <asp:Panel ID="panelToBeUpdated" runat="server">
            <asp:Label ID="lblContent" runat="server" ></asp:Label>
        </asp:Panel>
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="timer" />
    </Triggers>
</asp:UpdatePanel>

我会使用Jquery向服务器发送AJax请求，以获取更新的内容。收到内容后，我将再次使用JQuery来更新标记。

您可以使用Javascript 中的setInterval将其设置为每5分钟触发一次

没有代码很难给出具体的例子。但是，您基本上需要使用定时器触发的ajax请求来加载新内容。

setInterval(function(){
    $.ajax({
      url: "someUrlThatServesUpdatedContent.aspx",
      cache: false
    }).done(function( html ) {
      $("#results").html(html);
    });
}, 300000);

以上只是一个简单的例子，可以为您指明正确的方向。

编辑：下面是一个如何在没有JQuery的情况下进行ajax调用的示例https://stackoverflow.com/a/2792721/1059001

使用AJAX使用前面答案中描述的方法可以做到这一点，但如果您希望有一个服务器端解决方案，我建议将页面的这一部分加载到iframe中，并使用元刷新：

<meta http-equiv="refresh" content="300">

然而，这种方法会使任何事件或用户操作都很难返回主页。

相关文章：