避免仅在Enter键上提交表单
[英]Avoid only form submission on Enter key press
问题描述
我有一种形式，其中有一些输入以及如下所示的文本区域。
<form id="my_form" action="/action_page.php">
First name:<br>
<input type="text" name="firstname">
<br>
Last name:<br>
<input type="text" name="lastname">
<br>
Note:<br>
<textarea id="note" name="note"></textarea>
<br>
<input type="submit" value="Submit">
</form>
我必须在按Enter键时禁用表单提交。 只需单击提交按钮即可提交表格。
我在stackoverflow上找到了此解决方案，因此我在下面的代码中进行了编写。
$("#my_form").keypress( function( e ) {
var code = e.keyCode || e.which;
if ( code == 13 ) {
e.preventDefault();
return false;
}
});
它工作正常，但是在按Enter键时不允许在文本区域中输入换行符 。 我该如何实现？
5 个解决方案
解决方案1
2 2018-12-24 06:14:28
简单，只需更改：
<input type="submit" value="Submit">
至：
<input type="button" value="Submit">
然后处理jQuery（或纯JS）中的按钮单击。
解决方案2
1 已采纳 2018-12-24 06:17:57
用此按钮替换您的按钮
<button type="button" onclick="formSubmit()">Submit</button>
然后处理程序使用如下所示的javascript提交事件。
function formSubmit() {
//here your code
}
解决方案3
0 2018-12-24 06:13:03
您可以使用:not()选择器进行输入。
$("#my_form:not(input:text)").keypress( function( e ) {
var code = e.keyCode || e.which;
if ( code == 13 ) {
e.preventDefault();
return false;
}
});
解决方案4
0 2018-12-24 06:14:24
只需将$（“＃my_form”）替换为$（“＃my_form input：text ”）。
所以代码看起来像
$("#my_form input:text").keypress( function( e ) {
//Do stuff here
});
解决方案5
0 2018-12-24 06:20:11
这将起作用：
<html lang="en">
<head>
<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<form id="my_form" action="/action_page.php">
First name:<br>
<input type="text" name="firstname" id="f">
<br>
Last name:<br>
<input type="text" name="lastname" id="l">
<br>
Note:<br>
<textarea id="note" name="note"></textarea>
<br>
<input type="submit" value="Submit">
</form>
<script>
$("#note").keypress( function( e ) {
var code = e.keyCode || e.which;
if ( code == 13 ) {
return true;
}
});
$("#f").keypress( function( e ) {
var code = e.keyCode || e.which;
if ( code == 13 ) {
e.preventDefault();
return false;
}
});
$("#l").keypress( function( e ) {
var code = e.keyCode || e.which;
if ( code == 13 ) {
e.preventDefault();
return false;
}
});
</script>
</body>
</html>
将id s用作名字和姓氏输入。 禁用按键。
Angular2阻止在指令内按下回车键提交表单
[英]Angular2 prevent form submission on press of the enter key from within a directive
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.