1

我创建了一个简单的页面来测试它。

我的页面将有一个文本框和一个按钮。如果单击按钮，服务器端的按钮单击事件将在文本框中写入一些文本。

然后我有一个 jQuery 函数来检测文本框的输入按键。

如果它检测到输入键，它将单击该按钮。

标记： 

<asp:TextBox ID="txtTest" runat="server"></asp:TextBox>
<asp:Button ID="btnClick" runat="server" Text="test" onclick="btnClick_Click" />
<script type="text/javascript">
    $('#<%=txtTest.ClientID%>').keypress(function (e) {
        var code = (e.keyCode ? e.keyCode : e.which);
        if (code == 13) { //Enter keycode
            $('#<%=btnClick.ClientID%>').click();
        }
    });
</script>

代码隐藏：

protected void btnClick_Click(object sender, EventArgs e)
{
    txtTest.Text = "btnclick click event";
}

它适用于每次刷新。

然后我实现了一个ScriptManager。

标记：

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <asp:TextBox ID="txtTest" runat="server"></asp:TextBox>
        <asp:Button ID="btnClick" runat="server" Text="test" onclick="btnClick_Click" />
        <script type="text/javascript">
            $('#<%=txtTest.ClientID%>').keypress(function (e) {
                var code = (e.keyCode ? e.keyCode : e.which);
                if (code == 13) { //Enter keycode
                    alert('hihi');
                    $('#<%=btnClick.ClientID%>').click();
                }
            });

        </script>
    </ContentTemplate>
</asp:UpdatePanel>

代码隐藏：

protected void btnClick_Click(object sender, EventArgs e)
{
    txtTest.Text = "btnclick click event";
}

然后它只适用于第一次输入，螺母不适用于第二次输入。

有人遇到过这种问题吗？

4

2 回答 2

0

只需将此代码块放在 scriptmanager 标签之外，它就可以正常工作

 <script type="text/javascript">
                $('#<%=txtTest.ClientID%>').keypress(function (e) {
                    var code = (e.keyCode ? e.keyCode : e.which);
                    if (code == 13) { //Enter keycode
                        alert('hihi');
                        $('#<%=btnClick.ClientID%>').click();
                    }
                });

</script>
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
...
...

更新

为什么您处理按键的代码不在 $(document).ready 内？

$(document).ready(function() {
    $('#<%=txtTest.ClientID%>').keypress(function (e) {
                        var code = (e.keyCode ? e.keyCode : e.which);
                        if (code == 13) { //Enter keycode
                            alert('hihi');
                            $('#<%=btnClick.ClientID%>').click();
                        }
                    });
 });

请参阅以下线程，其中提到的问题类似。但解决方案不是把它放在document.Ready中，而是每次通过调用RegisterStartupScript来绑定点击的脚本

于 2012-07-26T08:29:35.243 回答
0

我会在这里做一些事情。首先，我会将您的 JS 代码放在一个单独的文件中，然后<script>从 UpdatePanel 中删除标签。（但是，如果您将以下脚本直接放在<head>标签中，这也将起作用）。这意味着您不能使用 ClientID 属性 - 我们将使用 jQuery 选择器对其进行排序。此外，您需要在 document ready 和 partial postback 上绑定事件。所以在你的JS中......

//define the bind function
function bindEvents(){
    //the selector '[ID$="txtTest"]' will select any element with ID ending
    //txtTest - make sure there's only 1!!

    $('[ID$="txtTest"]').keypress(function (e) {
            var code = (e.keyCode ? e.keyCode : e.which);
            if (code == 13) { //Enter keycode
                alert('hihi');
                $('[ID$="txtTest"]').click();
            }
    });  
}


//bind on doc ready
$(function(){
    bindEvents();

    //and bind on partial postback too  
    Sys.WebForms.PageRequestManager.getInstance().add_endRequest(bindEvents()); 
});
于 2012-07-26T09:30:53.937 回答