javascript 使用 jQuery submit() 按下回车键时提交表单
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5050124/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Submit form when enter is pressed using jQuery submit()
提问by yoda
I have a handler to catch the event of an "enter" inside a set of inputs in the context of an authentication function, but it's not working when I press the key. The code is as follows :
我有一个处理程序可以在身份验证函数的上下文中捕获一组输入中的“输入”事件，但是当我按下键时它不起作用。代码如下：
$('#login form').submit(function(e) { login(e); });
function login(e)
{
e.preventDefault();
var l = $('#logo a').attr('href');
var name = $('#login input[name="login_username"]').val();
var pass = $('#login input[name="login_password"]').val();
$.ajax({
type: 'POST',
url: l+'user/login',
data: 'username='+name+'&password='+pass,
cache: false,
dataType: 'json',
success: function(response)
{
if (response.status == true)
window.location = response.redirect;
else
jQuery.facebox('<p class="facebox-notice">'+response.error+'</p>');
}
});
}
It does work, however, to the button I have for the same purpose :
但是，它确实适用于我出于相同目的而拥有的按钮：
$('#dologin').click(function(e) { login(e); });
Any ideas why? Cheers!
任何想法为什么？干杯!
EDIT
编辑
The markup is as follows :
标记如下：
<div id="login">
<form action="" method="post">
<input type="text" name="login_username" />
<input type="password" name="login_password" />
<a href="" id="dologin">LOGIN</a>
</form>
</div>
回答by Felix Kling
So your goal is to submit the form when Enteris pressed, correct?
所以你的目标是在Enter按下时提交表单，对吗？
The easiest way to achieve this is to use a submit button
实现此目的的最简单方法是使用提交按钮
<input type="submit" value="Login" />
instead of the link. Then the event is handled by the browser.
而不是链接。然后事件由浏览器处理。
If you prefer to have a link because of the style, you can use CSS to style the button and make it look like a link.
如果您因为样式而更喜欢使用链接，您可以使用 CSS 来设置按钮的样式并使其看起来像一个链接。
回答by unclenorton
Try to include a hiddensubmit button in your form.
尝试在您的表单中包含一个隐藏的提交按钮。
updatedOkay, that would work in Firefox, but not in Chrome. IE, I suppose, won't handle it too.
更新好的，这在 Firefox 中有效，但在 Chrome 中无效。我想，IE 也不会处理它。
Well, you can go script way http://jsfiddle.net/GqHzZ/. Add a keypress handler on all event fields that would trigger the submit function, like this:
好吧，您可以使用脚本方式http://jsfiddle.net/GqHzZ/。在将触发提交功能的所有事件字段上添加按键处理程序，如下所示：
$(document).ready(function(){
$('#login form input').keypress(function(e) { if(e.which == '13')login(e); });
回答by Justin Jenkins
With webkit based browsers (Chrome, Safari) I've found that trying to do certain "on click" events, submits and other things with a blank href element in your anchor tag won't work.
使用基于 webkit 的浏览器（Chrome、Safari）时，我发现尝试使用锚标记中的空白 href 元素执行某些“点击”事件、提交和其他操作是行不通的。
<a href="" id="dologin">LOGIN</a>
The reason is simply that your href is blank.
原因很简单，你的 href 是空白的。
If you set it as pretty much anything, for example #and return falsein your jQuery ... webkit will work just like Firefox, and other browsers.
如果您将其设置为几乎任何内容，例如#并在您的 jQuery 中返回 false... webkit 将像 Firefox 和其他浏览器一样工作。
The return falsepart, btw ... prevents the "default action" which would be to "follow" the # link.
该回报虚假部分，顺便说一句......阻止“默认操作”，这将是“跟随”＃链接。
HTML
HTML
<a href="#" id="submitbutton">LOGIN</a>
jQuery
jQuery
<script>
$(document).ready(function() {
$('#submitbutton').click(function() {
$('#someForm').submit();
return false;
});
});
</script>
This is even more strictly enforced (it seems) on mobile webkit, i.e. iPhone, iPad, Android.
这在移动 webkit，即 iPhone、iPad、Android 上执行得更加严格（似乎）。
回答by xzyfer
updated
更新
What you need is to have an <input type=submit>. However you can choose to hide it off screen. That way you get the submition on enterfor free.
您需要的是拥有一个<input type=submit>. 但是，您可以选择将其隐藏在屏幕外。这样你就enter可以免费提交。
Keep in mind though you can't hide the submit with display:noneof changing visibility because it then becomes an inactive element, and won't work on most browsers.
请记住，虽然您无法隐藏display:none更改可见性的提交，因为它随后会成为非活动元素，并且在大多数浏览器上都不起作用。
