通过按Enter键而不提交按钮来提交表单

本文翻译自：Submitting a form by pressing enter without a submit button

Well I am trying to submit a form by pressing enter but not displaying a submit button. 好吧，我试图通过按Enter提交表单，但不显示提交按钮。 I don't want to get into JavaScript if possible since I want everything to work on all browsers (the only JS way I know is with events). 我不希望尽可能地使用JavaScript，因为我希望所有功能都可以在所有浏览器上运行（我知道的唯一JS方式就是使用事件）。

Right now the form looks like this: 现在，表单如下所示：

<form name="loginBox" target="#here" method="post">
    <input name="username" type="text" /><br />
    <input name="password" type="password" />
    <input type="submit" style="height: 0px; width: 0px; border: none; padding: 0px;" hidefocus="true" />
</form>

Which works pretty well. 哪个效果很好。 The submit button works when the user presses enter, and the button doesn't show in Firefox, IE, Safari, Opera and Chrome. 当用户按下Enter键时，提交按钮将起作用，并且该按钮在Firefox，IE，Safari，Opera和Chrome中不显示。 However, I still don't like the solution since it is hard to know whether it will work on all platforms with all browsers. 但是，我仍然不喜欢该解决方案，因为很难知道它是否可以在所有浏览器的所有平台上运行。

Can anyone suggest a better method? 谁能提出更好的方法？ Or is this about as good as it gets? 还是说它尽可能地好？

---

#1楼

参考：https://stackoom.com/question/20Gh/通过按Enter键而不提交按钮来提交表单

---

#2楼

I added it to a function on document ready. 我将其添加到文档准备就绪的功能中。 If there is no submit button on the form (all of my Jquery Dialog Forms don't have submit buttons), append it. 如果表单上没有提交按钮（我的所有Jquery对话框表单都没有提交按钮），请附加它。

$(document).ready(function (){
    addHiddenSubmitButtonsSoICanHitEnter();
});
function addHiddenSubmitButtonsSoICanHitEnter(){
    var hiddenSubmit = "<input type='submit' style='position: absolute; left: -9999px; width: 1px; height: 1px;' tabindex='-1'/>";
    $("form").each(function(i,el){
        if($(this).find(":submit").length==0)
            $(this).append(hiddenSubmit);
    });
}

---

#3楼

Just set the hidden attribute to true: 只需将hidden属性设置为true即可：

<form name="loginBox" target="#here" method="post">
    <input name="username" type="text" /><br />
    <input name="password" type="password" />
    <input type="submit" hidden="true" />
</form>

---

#4楼

最简单的方法

<input type="submit" style="width:0px; height:0px; opacity:0;"/>

---

#5楼

Another solution without the submit button: 没有提交按钮的另一种解决方案：

HTML 的HTML

<form>
  <input class="submit_on_enter" type="text" name="q" placeholder="Search...">
</form>

jQuery jQuery的

$(document).ready(function() {

  $('.submit_on_enter').keydown(function(event) {
    // enter has keyCode = 13, change it if you want to use another button
    if (event.keyCode == 13) {
      this.form.submit();
      return false;
    }
  });

});

---

#6楼

IE doesn't allow pressing the ENTER key for form submission if the submit button is not visible, and the form has more than one field. 如果“提交”按钮不可见，并且表单具有多个字段，则IE不允许按ENTER键提交表单。 Give it what it wants by providing a 1x1 pixel transparent image as a submit button. 提供1x1像素的透明图像作为提交按钮，以提供所需的内容。 Of course it will take up a pixel of the layout, but look what you have to do to hide it. 当然，它会占用布局的一个像素，但请注意隐藏它所要做的事情。

<input type="image" src="img/1x1trans.gif"/>