Javascript 防止按钮在回车键时提交
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/4075486/
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
Prevent a button to submit on enter key
提问by ??????q-????s
I have two buttons one with id=enterToSubmit and other with id=clickToSubmit. When a user hit the enterkey, I want "enterToSubmit" button to submit form not the "clickToSubmit" button.
我有两个按钮,一个是 id=enterToSubmit,另一个是 id=clickToSubmit。当用户按下回车键时,我希望“enterToSubmit”按钮提交表单而不是“clickToSubmit”按钮。
On the same page, I have a textbox id=title, and on Page Load I hide "enterToSubmit " button, until user enters something in the textbox, then users can hit Enter key to submit form.
在同一页面上,我有一个文本框 id=title,在页面加载时我隐藏了“enterToSubmit”按钮,直到用户在文本框中输入内容,然后用户可以按 Enter 键提交表单。
How do preven "clickToSubmit" button to submit when users press Enter key?
当用户按下 Enter 键时,如何防止“clickToSubmit”按钮提交?
回答by bobince
Unfortunately you can't change the ‘default' submit button in HTML, it's always the first input
/button
with type submit
/image
.
不幸的是,您无法更改 HTML 中的“默认”提交按钮,它始终是第一个input
/button
类型为submit
/ image
。
Whilst you can attempt to catch Enter keypress
events manually it is highly unreliable to do so, since Enter isn't always supposed to submit a form, depending on (a) what type of element is focused, (b) whether shift/ctrl+enter is used, (c) what other elements are in the form and (d) what browser it is. If you miss a case you will get accidental default-submissions; if you hit a case you shouldn't, you'll get accidental enter-submissions.
虽然您可以尝试keypress
手动捕获 Enter事件,但这样做是非常不可靠的,因为 Enter 并不总是应该提交表单,这取决于 (a) 关注的元素类型,(b) 是否 shift/ctrl+enter使用,(c) 表单中有哪些其他元素以及 (d) 它是什么浏览器。如果您错过了一个案例,您将意外收到默认提交;如果您遇到不该遇到的情况,您会意外地收到输入。
So it is in general better, when you want to control the default submission action of a form, to put an extra button in as the first submit button in the form. If you don't want this button to be displayed, you can position it with a large negative left
value to push it off the side of the page. (This is a bit ugly, but hiding it via display
or visibility
will stop it working in some browsers.)
所以一般来说,当你想要控制表单的默认提交操作时,将一个额外的按钮作为表单中的第一个提交按钮放置会更好。如果你不想显示这个按钮,你可以用一个大的负值来定位它,left
把它推离页面的一侧。(这有点难看,但通过display
或隐藏它visibility
会阻止它在某些浏览器中工作。)
So perhaps you could ‘hide' the enter-to-submit button not by making it disappear but by pushing it off the page where it can't be seen, and then catching the click
event on it to return false
and stop the form submission.
因此,也许您可以“隐藏”输入提交按钮,而不是让它消失,而是将其推离无法看到的页面,然后click
在其上捕获事件return false
并停止表单提交。
回答by Sarfraz
How do preven "clickToSubmit" button to submit when users press Enter key?
当用户按下 Enter 键时,如何防止“clickToSubmit”按钮提交?
Try this:
尝试这个:
$("#clickToSubmit").on("keydown", function(e){
if(e.keyCode === 13){
e.preventDefault();
}
});
回答by AVISHEKKT47
$('#formId').on('keyup keypress', function(e) {
var keyCode = e.keyCode || e.which;
if (keyCode === 13) {
e.preventDefault();
return false;
}
});
Usually form is submitted on Enter when you have focus on input
elements.
We can disable Enter key (code 13) on input elements within a form.
Also, As in some newer versions of Firefox the form submission is not prevented, it's safer to add the keypress event to the form as well.
此外,在某些较新版本的 Firefox 中,不会阻止表单提交,将 keypress 事件添加到表单中也更安全。
回答by Praveen Prasad
jQuery('#clickToSubmit').click(function(e){
if(e.keyCode==13){
e.preventDefault();
}
});
回答by sushil bharwani
First you have to make sure that both the buttons are not of type submit. Now on both this buttons you can call two different javascript functions. enterToSubmit() and clickToSubmit() also see that on enterToSubmit() you read the enter key press
首先,您必须确保两个按钮都不是提交类型。现在在这两个按钮上,您可以调用两个不同的 javascript 函数。enterToSubmit() 和 clickToSubmit() 还可以看到在 enterToSubmit() 上您阅读了 Enter 按键
if (e.keyCode === 13){ form.submit(); }
if (e.keyCode === 13){ form.submit(); }
and call form.submit()
并调用 form.submit()
while on clickToSubmit() you do a direct form.submit()
而在 clickToSubmit() 你做一个直接的 form.submit()
回答by Chinmayee G
Try this code for text box enter
尝试使用此代码输入文本框
$j("#title").keypress(function(e1){
if(e1.keyCode==13){ // if user is hitting enter
return false;
}
});
for submit button
对于提交按钮
$j("#clickToSubmit").submit(function(e1){
if(e1.keyCode==13){ // if user is hitting enter
return false;
}
});