按提交表单中输入没有一个提交按钮
https://stackoverflow.com/questions/477691
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russian题
那么我想按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>
这工作得很好。当用户按下输入按钮提交作品，和按钮无法在Firefox，IE，Safari浏览器，歌剧和铬展示。不过，我还是不喜欢的解决方案，因为它是很难知道它是否会与所有浏览器所有的平台上工作。
任何人都可以提出一个更好的方法？或者，这是约尽善尽美？
解决方案
尝试：
<input type="submit" style="position: absolute; left: -9999px"/>
这将waaay按下按钮到左边，在屏幕之外。这个的好处是，当CSS被禁用，您会得到适度的降级。
<强>更新 - 解决方法为IE7
如同tabindex以防止标签达到这个按钮（通过阿泰古拉尔）建议由Bryan唐宁+：
<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;
}
});
});
有关的人看着这个答案在未来，HTML5实现表单元素，hidden一个新的属性，它会自动适用display:none到你的元素。
e.g。
<input type="submit" hidden />
使用下面的代码，这个固定我的问题在所有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;在样式属性。不过，我还是会建议使用一个有点简单的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>
这样做的最优雅的方式是保持提交按钮，但设置它的边框，填充和字体大小为0。
这将使按钮尺寸为0x0。
<input type="submit" style="border:0; padding:0; font-size:0">
您可以自己试用，并通过轮廓线设定的元素，你会看到一个圆点，这是外边框“周围的” 0x0的像素元。
没有必要的可见性：隐藏，但是如果它让你在晚上睡觉，你可以扔掉，在组合以及
IE不允许加压提交表单ENTER键，如果提交按钮是不可见的，并且该形式具有多于一个的字段。给它什么，它希望通过提供1x1像素的透明图片作为提交按钮。当然它会占用布局的像素，而是看你需要做的隐藏什么。
<input type="image" src="img/1x1trans.gif"/>
这是我的解决方案，在浏览器，Firefox 6和测试IE7 +：
.hidden{
height: 1px;
width: 1px;
position: absolute;
z-index: -100;
}
最简单的方法
<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像素的图像
<input type="submit" style="display:none;"/>
这工作得很好，它是你想达到什么样的最明确的版本。
请注意不存在用于其它形式的元件display:none和visibility:hidden之间的差。
HTML5溶液
<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 class="hidden" type="submit" value=""
onclick="document.getElementById('loginform').submit()"; />
和
.hidden {
border:0;
padding:0;
font-size:0;
width: 0px;
height: 0px;
}
在.css文件。 它的工作奇迹般地对我来说太。 ：）
