Question

我正在使用aps.net和vb.net

在提交网络表单（ application.aspx ）后的我的应用程序中，用户被重定向到另一个（ application_complete.aspx ）页面。

application.aspx页面中的webform非常长。并且用户必须向下滚动以完成表单并提交。问题是在提交表单（appplication.aspx）之后，application_complete.aspx页面也变得很长（与application.aspx大小相同）虽然其中没有太多内容并且使浏览器自动定位在同一个地方（底部这页纸）。因此，用户必须向上滚动才能阅读该消息。这对用户来说非常恼火。（见图片）

picture1：（appplication.aspx）

picture2：application_complete.aspx

我需要什么 我想在页面顶部加载页面（application_complete.aspx），并将焦点设置在该页面的消息部分。

这是我的application_complete.aspx页面代码

<%@ Page Title="" Language="VB" MasterPageFile="~/c/MasterPage.master" AutoEventWireup="false" CodeFile="application-complete.aspx.vb" Inherits="c_application_complete" %>
<%@ MasterType VirtualPath="~/c/MasterPage.master" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="mainContent" Runat="Server">


<h2>Thank you! we have now received your application</h2>

<div class="btn-wrapper">
    <a target="_parent" href="<%= Master.EmployerCareersHome %>" class="btn v-view-all">View other open positions</a>
</div>

</asp:Content>

这是我的application_complete.aspx.vb代码

Partial Class c_application_complete
    Inherits System.Web.UI.Page

End Class

我尝试在application_complete.aspx页面中添加以下脚本，并为div部分提供id。

<asp:Content ID="Content3" ContentPlaceHolderID="ScriptContent" runat="server">
<script type="text/javascript">
    $(document).ready(function() {
         $("#<%= dvbtn.ClientID %>").focus();

    });
</script>

</asp:Content>

并在application_complete.aspx.vb页面中。

    Protected Sub PageLoad(ByVal sender As Object, ByVal e As EventArgs)

         Page.SetFocus(dvbtn)

    End Sub

但那不起作用。

供您参考

整个网络表单及其所有功能都在iframe中。可以让父网页从iframe滚动到特定位置（在顶部）。
虽然application_complete页面中的内容不多，但由于篇幅较长（在application.aspx页面中），此页面（application_complete）也会变长。如果有人刷新它，那么页面会恢复到原来的大小并专注于最高职位。但刷新会导致重新提交表单，所以不能这样做。

期待您的帮助。

Answer 1

在你的页面中放置一个类似的东西：

<a name="loadtohere" />

然后在您的重定向中，将页面发送到：

page.aspx＃loadtohere

编辑：

好的，在您的源代码文件中添加上面的html：

<a name="loadtohere" />

然后在你的代码背后：

// Create the redirect link (better way of creating your string)
Dim redirect = String.Format("application-complete.aspx?e={0}&b={1}&i={2}&hp={3}&hI={4}#loadtohere, Vacancy.EmployerID, CInt(Request("b")), Vacancy.ID, Request("hp"), Request("hI"))

// Redirect to the page
Response.Redirect(redirect)

“loadtohere”文本可以更改为您想要的任何内容，它只是在加载页面时移动页面的锚点的名称。

Answer 2

我的元素未获得焦点的原因是因为它是<div>而不是实际的<button>元素。默认情况下，<div>元素不会作为Tab键顺序的一部分被选中，因此它们通常不会获得焦点。

所以我通过在我的div元素中添加tabindex属性解决了聚焦问题。

<div class="btn-wrapper" id="dvbtn" runat="server" tabindex="0" autofocus>
    <a target="_parent" href="<%= Master.EmployerCareersHome %>" class="btn v-view-all">View other open positions</a>
</div>

并使用脚本

<asp:Content ID="Content3" ContentPlaceHolderID="ScriptContent" runat="server">
   <script type="text/javascript">
         $(document).ready(function() {
              $("#<%= dvbtn.ClientID %>").focus();

         });
   </script>

</asp:Content>

setfocus也解决了滚动问题。

如何在页面加载时将焦点设置到特定部分，并使浏览器滚动到该位置

2 个答案: