使用jQuery在'Enter'上提交表单？

Question

我有一个bog标准的登录表单 - 一个电子邮件文本字段,一个密码字段和一个使用HTML/jQuery的AIR项目的提交按钮.当我在表单上按Enter键时,整个表单的内容消失,但表单未提交.有谁知道这是否是一个Webkit问题(Adobe AIR使用Webkit for HTML),或者我是否已将事情搞砸了？

我试过了:

$('.input').keypress(function (e) {
  if (e.which == 13) {
    $('form#login').submit();
  }
});

但这既没有阻止清算行为,也没有提交表格.没有与表单相关的操作 - 这可能是问题吗？我可以在动作中加入javascript函数吗？

Answer 1

$('.input').keypress(function (e) {
  if (e.which == 13) {
    $('form#login').submit();
    return false;    //<---- Add this line
  }
});

注意:您接受了bendewey的答案,但它对e.preventDefault()的描述不正确.看看这个stackoverflow答案: event.preventDefault()与return false

从本质上讲,"return false"与call e.preventDefault和e.stopPropagation().

Answer 2

除了Jason Cohen提到的返回假.您可能还必须阻止默认

e.preventDefault();

Answer 3

不知道它是否有用,但您可以尝试模拟提交按钮单击,而不是直接提交表单.我在生产中有以下代码,它工作正常:

    $('.input').keypress(function(e) {
        if(e.which == 13) {
            jQuery(this).blur();
            jQuery('#submit').focus().click();
        }
    });

注意:jQuery('#submit').focus()会在按下enter时使按钮生动.

Answer 4

返回false以防止击键继续.

Answer 5

有什么理由你必须挂钩并测试回车键吗？

你不能简单地添加一个

<input type="submit" /> 

到你的表格,并在按下输入时自然提交？你甚至可以勾住表单的onsubmit动作,如果你想要的话,从那里调用验证函数......

您甚至可以使用onsubmit测试来查看您的表单是否正在提交,但如果您打电话,它将无法使用form.submit().

Answer 6

这是一种作为JQuery插件执行此操作的方法(如果您想重新使用该功能):

$.fn.onEnterKey =
    function( closure ) {
        $(this).keypress(
            function( event ) {
                var code = event.keyCode ? event.keyCode : event.which;

                if (code == 13) {
                    closure();
                    return false;
                }
            } );
    }

现在,如果你想用这种类型的功能来装饰它,它就像这样简单:

$('#your-input-id').onEnterKey(
    function() {
        // Do stuff here
    } );

Answer 7

您还可以简单地添加onsubmit="return false"到页面中的表单代码以防止默认行为.

然后将表单的事件挂钩(.bind或.live)submit到javascript文件中的jQuery的任何函数.

以下是帮助的示例代码:

HTML

<form id="search_form" onsubmit="return false">
   <input type="text" id="search_field"/>
   <input type="button" id="search_btn" value="SEARCH"/>
</form>

Javascript + jQuery

$(document).ready(function() {

    $('#search_form').live("submit", function() {
        any_function()
    });
});

这是在2011-04-13,使用Firefox 4.0和jQuery 1.4.3

Answer 8

这是我的代码：

  $("#txtMessage").on( "keypress", function(event) {
    if (event.which == 13 && !event.shiftKey) {
        event.preventDefault();
        $("#frSendMessage").submit();
    }
    });