通过在没有提交按钮的情况下按Enter来提交表单

Question

通过在没有提交按钮的情况下按Enter来提交表单嗯，我试图提交一个表格，按下Enter，但不显示提交按钮。如果可能的话，我不想进入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>效果很好。当用户按Enter键时，Submit按钮工作，并且该按钮在Firefox、IE、Safari、Opera和Chrome中不显示。但是，我仍然不喜欢这个解决方案，因为很难知道它是否能在所有浏览器的平台上工作。有人能提出更好的方法吗？还是像现在一样好？

Answer 1

试着：

<input type="submit" style="position: absolute; left: -9999px"/>

这将推动按钮向左，走出屏幕。这样做的好处是，当CSS被禁用时，您会得到优雅的降级。

更新-IE7的解决方案

正如布莱恩·唐宁+的建议tabindex为了防止选项卡到达此按钮(由Ates Gor)：

<input type="submit" 
       style="position: absolute; left: -9999px; width: 1px; height: 1px;"
       tabindex="-1" />

Answer 2

我觉得你应走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>

Answer 3

你试过这个吗？

<input type="submit" style="visibility: hidden;" />

因为大多数浏览器都能理解visibility:hidden它并不是真的像display:none我猜应该会没事的。还没亲自测试过所以CMIIW。