如何防止每次单击带有OnClick事件的按钮时页面都会变为顶部

本文关键字：顶部 按钮 何防止 单击 事件 OnClick | 更新日期: 2023-09-27 18:20:48

如何防止每次单击按钮时页面返回顶部？我仍然想在按钮的"OnClick"事件上执行代码。

示例：

我们几乎所有的表单都在页面底部有一个按钮，用来从数据库中带回一些数据，并填充页面底部的一些标签和文本框，当点击按钮时，用户会回到页面顶部。我该如何防止这种情况发生？

任何帮助都将不胜感激。

如何防止每次单击带有OnClick事件的按钮时页面都会变为顶部

假设OnClick事件是在服务器上处理的，而不是在javascript中处理的，最简单的方法是将要更新的控件包装在UpdatePanel中，并在按钮的单击事件上触发更新面板。

下面是微软文档中的一个例子：

<asp:Button ID="Button1" 
            Text="Refresh Panel"
            runat="server" />
<asp:ScriptManager ID="ScriptManager1" 
                   runat="server" />
<asp:UpdatePanel ID="UpdatePanel1" 
                 UpdateMode="Conditional"
                 runat="server">
                 <Triggers>
                   <asp:AsyncPostBackTrigger ControlID="Button1" />
                 </Triggers>
                 <ContentTemplate>
                 <fieldset>
                 <legend>UpdatePanel content</legend>
                 <%=DateTime.Now.ToString() %>
                 </fieldset>
                 </ContentTemplate>
</asp:UpdatePanel>

有两个选项：

  1. 使用ASP.NET Ajax，特别是UpdatePanel控件
  2. 在页面级别或web.config中将MaintainScrollPositionOnPostback设置为true

在页面声明中，您可以添加MaintainScrollPositionOnPostback="true"即：

<%@ Page Language="C#" ... MaintainScrollPositionOnPostback="true" %>

你也可以把它放在system.web下的web.config中，或者从codeehind Page中声明它。MaintainScrollPositionOnPostback=true；

在按钮的函数处理程序中，确保返回false。实际上，你可能是在用这些按钮发布页面，而不仅仅是在点击事件上做一些事情。

相关文章：