当不是默认的表单操作时，如何使用JavaScript或jQuery使用Enter键提交表单

我有一个页面，它有三个用户很明显的“表单”。在后台，页面只有一个表单，使用html:form作为JSP对象控制整个页面。当用户单击用于各个提交按钮的图像时，它会触发onClick（）函数，该函数绕过表单的操作并执行另一个操作

<html:form action="foo.do">
    <html:text property="name" styleClass="input" />
    <img src="bar.jpg" onClick="myFunction();" />
</html:form>

<script>
    function myFunction(){
        document.forms[0].action = "realPage.do";
        document.forms[0].submit();
    }
</script>

函数myFunction（）{
document.forms[0].action=“realPage.do”；
document.forms[0]。提交（）；
}

此脚本可以工作，它不会将用户发送到默认的“foo.do”，而是发送到函数的目标（realPage.do）

---

然而，问题是，我的用户希望在他们想要提交的特定“表单”的任何一个字段中，只需在键盘上点击“回车”即可提交表单。如何使用JavaScript或jQuery识别用户所在的“表单”和输入字段，检测按下“回车”键并使用与按钮相同的功能提交？

这应该可以解决您的问题

$(document).ready(function(){
    $("input").keyup(function (e) {
        if (e.keyCode == 13) {
            // Submit your form here
        }
    });
});

---

我可能会阻止表单提交并检测哪个元素具有焦点。类似于此，其中每个伪表单都有一个已标识的包装器元素：

$(function() { // document.ready
    $('#myform').submit(function(event) {
        event.preventDefault();

        if ( $('#pseudoForm1 input').is(':focus') ) { ... }
        else if ( $('#pseudoForm2 input').is(':focus') ) { ... }
        else if ( $('#pseudoForm3 input').is(':focus') ) { ... }
    });
});

---

你可以从这个开始-

$('input').keypress(function(e) {
    if(13 == e.keyCode) {
        var closestForm = $(this).closest('form');
        $(closestForm).submit();
    }
});

---

如果每个“表单”都是真正独立的表单（它们都是单个表单元素的一部分），那么这可能会起作用。如果它都是一个表单，并且您必须将其分解，那么您可以

wrap（）

在表单元素中执行提交，然后

unwrap（）

它们。如果需要，可以插入表示包装点的div。我只尝试了第一部分，使用preventDefault（）函数阻止表单提交，但表单仍然提交。在输入字段有机会运行此代码之前，按enter键提交表单。