当按下回车键时，文本框如何聚焦于按钮？

Question

我有一个文本框，当用户输入值并按下回车键时，我希望该值在用户按下回车键时提交。

<div id="divUserInfo" >
    <table align="center">
        <tr  id="trDomain" runat="server" visible="false">
            <td class="tdLabel tdLabelInfo" >Domain Name</td>
            <td class="tdData">
                <asp:TextBox ID="txtDomain" runat="server" ToolTip="Network domain user is associated."></asp:TextBox>
                <asp:Label ID="lblRqdDom" runat="server" Text="required" CssClass="noshow" ></asp:Label>
            </td>
        </tr>

我知道我正在使用表格进行格式化，并且将来的项目中不会再使用表格。

- nhat

Answer 1

当 TextBox 失去焦点时进行 Postback

如果你只想在 TextBox 失去焦点时（通过按下 Enter, Tab 或将焦点移动到另一个控件），执行一个 postback，那么应该将 TextBox 的 AutoPostBack 属性设置为 true。

在 TextBox 中写入内容并使其失去焦点，就会触发 postback。然而，我认为这不仅仅是通过按 Enter 键而触发的。 更多信息，请参见 MSDN：http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.textbox.autopostback.aspx。

模拟单击提交按钮以触发 Postback

如果仅希望在按下 Enter 键时触发 postback，则可以在页面上添加一个 Button 并将其与相同的 Panel 控件中的 TextBox 放置在一起。然后，您应该为此 Panel 设置 DefaultButton 属性。当聚焦于 TextBox（或 Panel 中的任何其他控件）时，应该会调用按钮单击事件。

因此，您的代码可能如下所示（该代码未经过测试）：

...
<asp:Panel ID="grouppingPanel" runat="server" DefaultButton="btnSubmitDomain">
    <asp:TextBox ID="txtDomain" runat="server" ToolTip="Network domain user is associated." />
    <asp:Label ID="lblRqdDom" runat="server" Text="required" CssClass="noshow" ></asp:Label>

    <asp:Button ID="btnSubmitDomain" runat="server" Text="GO" OnClick="btnSubmitDomain_Click" />
</asp:Panel>
...

您可以在这里找到更多关于它的信息：http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.panel.defaultbutton.aspx。

如果您在应用任何解决方案或有进一步的问题时遇到任何问题，请告诉我。

- Lukasz M

Answer 2

首先，在您的page_load事件中注册此JavaScript：

    Public Shared Sub jsTrapEnter(ByRef p_Page As System.Web.UI.Page)

    Dim sScript As New System.Text.StringBuilder

    sScript.Append("<SCRIPT language=""javascript"">" & vbCrLf)
    sScript.Append("function fnTrapKD(btn){" & vbCrLf)
    sScript.Append(" if (document.all){" & vbCrLf)
    sScript.Append("   if (event.keyCode == 13)" & vbCrLf)
    sScript.Append("   { " & vbCrLf)
    sScript.Append("     event.returnValue=false;" & vbCrLf)
    sScript.Append("     event.cancel = true;" & vbCrLf)
    sScript.Append("     btn.click();" & vbCrLf)
    sScript.Append("   } " & vbCrLf)
    sScript.Append(" } " & vbCrLf)
    sScript.Append("}" & vbCrLf)
    sScript.Append("</SCRIPT>" & vbCrLf)

    If Not p_Page.ClientScript.IsClientScriptBlockRegistered("ForceDefaultToScript") Then
        p_Page.ClientScript.RegisterClientScriptBlock(p_Page.GetType, "ForceDefaultToScript", sScript.ToString)
    End If

End Sub

然后，该方法将向您想要具有默认按钮的每个编辑器控件添加属性：

    Public Shared Sub DefaultButton(ByVal objTextControl As Web.UI.WebControls.WebControl, ByVal objDefaultButtonID As String)

    objTextControl.Attributes.Add("onkeydown", String.Format("fnTrapKD(document.all.{0})", objDefaultButtonID))

End Sub

然后在我们的page_load事件中，将默认按钮与每个编辑器注册：

            DefaultButton(txtStreetNm, btnSearch.ClientID)
        DefaultButton(txtSuffix, btnSearch.ClientID)

- Robert Beaubien

Answer 3

你需要一个自定义的客户端事件来响应 Enter 键按下以编程方式提交表单，或者你需要一个类型为 submit 的 input。如果表单上有提交按钮，则在文本框中按下 Enter 以提交表单是默认行为。如果选择实现自定义事件处理程序，则需要将其附加到每个应在按下 Enter 键时提交表单的文本框。

注意：如果表单上有多个 submit 按钮，则默认行为是调用它们在 DOM 中出现的第一个按钮。如果不想显示官方的 submit 按钮，可以使用一些 CSS 来重新排列显示，或者可以在表单顶部放置一个隐藏的按钮作为“默认操作”。

- TLS