通过按回车提交表单而不用提交按钮
那么我试图通过按下提交表单，但不显示提交按钮。 如果可能的话，我不想进入JavaScript，因为我希望所有的浏览器都能正常工作（我知道的唯一的JS方式就是事件）。
现在表格看起来像这样：
<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> 哪个工作得很好。 当用户按下回车键时，提交按钮就起作用，而按钮不会在Firefox，IE，Safari，Opera和Chrome中显示。 然而，我仍然不喜欢这个解决方案，因为很难知道它是否可以在所有浏览器的所有平台上工作。
任何人都可以提出更好的方法？ 或者这是一样好，它得到？
尝试：
<input type="submit" style="position: absolute; left: -9999px"/>
这将按钮waaay向左，在屏幕之外。 这件事情的好处是，当CSS被禁用时，你会得到优雅的降级。
更新 – IE7的解决方法
正如布赖恩·唐宁（Bryan Downing）和tabindex建议，以防止标签到达这个按钮（Ates Goral）：
<input type="submit" style="position: absolute; left: -9999px; width: 1px; height: 1px;" tabindex="-1" />
我想你应该去的Javascript路线，或者至少我会：
<script type="text/javascript"> // Using jQuery. $(function() { $('form').each(function() { $(this).find('input').keypress(function(e) { // Enter pressed? if(e.which == 10 || e.which == 13) { this.form.submit(); } }); $(this).find('input[type=submit]').hide(); }); }); </script> <form name="loginBox" target="#here" method="post"> <input name="username" type="text" /><br /> <input name="password" type="password" /> <input type="submit" /> </form>
你尝试过吗？
<input type="submit" style="visibility: hidden;" />
由于大多数浏览器都理解visibility:hidden ，它并不像display:none那样工作，但是我猜测它应该没问题。 还没有真正测试过自己，所以CMIIW。
另一个解决方案没有提交按钮：
HTML
<form> <input class="submit_on_enter" type="text" name="q" placeholder="Search..."> </form>
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; } }); });
使用下面的代码，这在所有3个浏览器（FF，IE和Chrome）中解决了我的问题：
<input type="submit" name="update" value=" Apply " style="position: absolute; height: 0px; width: 0px; border: none; padding: 0px;" hidefocus="true" tabindex="-1"/>
将上面的行添加为代码中的第一行，并带有相应的名称和值。
取代当前用来隐藏按钮的黑客，设置visibility: collapse;会更简单visibility: collapse; 在style属性中。 不过，我仍然建议使用一些简单的Javascript来提交表单。 据我所知，现在对这种事情的支持是无处不在的。
只需将隐藏属性设置为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>
如果提交按钮不可见，IE不允许按ENTER键进行表单提交，并且表单有多个字段。 通过提供一个1×1像素的透明图像作为提交按钮来给它想要的东西。 当然，它会占用布局的一个像素，但看看你必须做什么来隐藏它。
<input type="image" src="img/1x1trans.gif"/>
这是我的解决方案，在Chrome，Firefox 6和IE7 +中测试：
.hidden{ height: 1px; width: 1px; position: absolute; z-index: -100; }
这样做的最优雅的方式是保持提交按钮，但将边框，填充和字体大小设置为0。
这将使按钮尺寸为0x0。
<input type="submit" style="border:0; padding:0; font-size:0">
你可以自己尝试，通过设置元素的轮廓，你会看到一个点，这是外围边界“围绕”0x0像素元素。
不需要可见性：隐藏，但如果它让你在晚上睡觉，你也可以把它扔在混合物中。
JS小提琴
最简单的方法
<input type="submit" style="width:0px; height:0px; opacity:0;"/>
对于IE和其他人有问题的人也是如此。
{ float: left; width: 1px; height: 1px; background-color: transparent; border: none; }
你也可以试试这个
<INPUT TYPE="image" SRC="0piximage.gif" HEIGHT="0" WIDTH="0" BORDER="0">
你可以包含一个图像的宽度/高度= 0像素
对于将来要查看这个答案的任何人，HTML5为表单元素实现了一个新的属性hidden ，它会自动将display:none应用于元素。
例如
<input type="submit" hidden />
我把它添加到文档准备好的功能。 如果表单上没有提交按钮（我的所有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); }); }
<input type="submit" style="display:none;"/>
这工作正常，这是你想要实现的最明确的版本。
请注意， display:none和visibility:hidden于其他表单元素之间。
我用过了
< input class="hidden" type="submit" value="" onclick="document.getElementById('loginform').submit()"; />
和
.hidden { border:0; padding:0; font-size:0; width: 0px; height: 0px; }
在.css文件中。 它对我也很神奇。 🙂
