Question

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

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

然后我有一个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";
}

然后它只适用于第一次输入，坚果不在第二次输入。

有人遇到过这种问题吗？

Answer 1

只需将此代码块放在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();
                        }
                    });
 });

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

Answer 2

我会在这里做一些事情。首先，我将您的JS代码放在一个单独的文件中，并从UpdatePanel中删除<script>标记。（但是，如果您将以下脚本直接放在<head>标记中，这也会有效。这意味着您不能使用ClientID属性 - 我们将使用jQuery选择器对其进行排序。此外，您需要在文档就绪和部分回发上绑定事件。所以在你的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()); 
});

Ajax脚本管理器阻止了jquery？

2 个答案: