防止回发与 jquery 绑定的函数答案

【问题标题】：prevent postback from function bound with jquery防止回发与 jquery 绑定的函数
【发布时间】：2013-02-14 17:38:15
【问题描述】：

当焦点位于特定文本框上时按下“Enter”键时，我正在尝试运行一些 javascript 代码。如果发生这种情况，我不希望页面回发。（但是，如果有人单击提交按钮，那么我希望页面像往常一样回发。）

我有一个包含以下内容的页面：

<script type="text/javascript">
$(function () {
    $('#txtInput').on('keyup', function (e) {
        if (e.keyCode == 13) {
            alert('enter was clicked');
            return false;
        }
    });
});
</script>

<asp:TextBox ID="txtInput" runat="server" ClientIDMode="Static"></asp:TextBox>
<asp:Button ID="btnSubmit" runat="server" OnClick="btnSubmitClick" Text="Submit" />

我一直认为return false; 是实现此目的的方法，但在这种情况下，它不起作用。

我也在我的javascript函数中尝试了以下方法，但无济于事。

$(function () {
    $('#txtInput').on('keyup', function (e) {
        if (e.keyCode == 13) {
            e.cancel = true;
            e.returnValue = false;
            alert('enter was clicked');
        }
    });
});

我的问题是：

1.为什么这不起作用？

2。我怎样才能实现这种行为？

【问题讨论】：

可能是因为 keyup 事件。理论上，钥匙已经打开，所以事件已经发生了。你试过用 keypress 代替吗？
@CarlosMartinezT，keypress 事件，结合return false，是我唯一可以开始工作的事情。谢谢你。您应该将此作为答案发布。

标签： javascript jquery asp.net postback asp.net-4.0

【解决方案1】：

您需要使用 keypress 事件，因为它发生在按键释放之前，因此可以取消。

引用评论：

这可能是因为 keyup 事件。理论上，关键已经起来，所以事件已经发生了。您是否尝试过 keypress 代替？

【讨论】：

【解决方案2】：

刚刚对此进行了测试，它仅适用于 keydown 事件，当释放键时为时已晚：

$(function () {
    $('#txtInput').on('keydown', function(e) {
        if (e.which == 13) e.preventDefault();
    });
});

FIDDLE

【讨论】：

不幸的是，这对我也不起作用。回发仍在进行中。
@JeremyWiggins - 那么你做错了其他事情，因为它应该可以正常工作！
我同意，但我不明白我怎么可能做错任何事；我完整地发布了我的应用程序。我看到它可以在您的小提琴上运行，但是从 asp.net 应用程序中，它仍然会发回。不过，使用 keypress 而不是 keydown 似乎可以解决问题。
keypress 和 keydown 在许多字符上的返回值实际上存在差异，但据我所知，它们都应该返回 13 以供输入。一定是 ASP 的东西？
@Jeremy - 哎呀，这是一个 ASP 应用程序，不是吗。由于某种原因，第一次完全错过了。是的，您需要使用“return false”，但您可能需要将它与 e.PreventDefault 结合使用。现在做一点研究。

【解决方案3】：

您是否尝试过使用e.PreventDefault()？对于这种情况，您可能还需要使用keydown 或keypress 来捕获默认事件。

<script type="text/javascript">
$(function () {
    $('#txtInput').on('keydown', function (e) {
        if (e.which == 13) {
            e.PreventDefault();
            alert('enter was clicked');
        }
    });
});
</script>

不过，您应该知道，通过破坏键盘功能，您并没有满足可访问性标准，这可能会使某些用户感到困难。确保为仅使用键盘的用户提供导航方式。

编辑：由于您的问题 (ASP.NET) 的性质，您可能需要以不同的方式解决此问题。

您可以 a) 看看这个问题：Canceling the default submit button in ASP.NET 或 b) 应用上面的 Javascript 解决方案，但将其应用到整个文档而不是元素。

我不建议使用第二个，因为它可能会破坏无障碍用户的功能。

【讨论】：

不幸的是，这对我也不起作用。回发仍在进行中。

【解决方案4】：

function PreventEnterKeyInTextBox(){
$('#txtInput').keypress(function(evt){evt=(evt)?evt:window.event; 
if(evt.keyCode==13){
    if($.browser.msie)
         {evt.cancelBubble=true; evt.returnValue=false;}
    else{evt.preventDefault();}
 }});
}
Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(PreventEnterKeyInTextBox);
//Or $(document).ready(function(){PreventEnterKeyInTextBox();});

【讨论】：