防止在输入时提交，但允许在newLine中输入TextArea
防止在输入时提交，但允许在newLine中输入TextArea
提问于 2017-11-13 13:52:09
是否可以阻止enter键提交表单，但允许enter键在输入中工作。(例如textArea换行线)？
我已经试过了：
e.preventDefault()e.stopPropagation()
都在表单标记onkeyup="if (e.keyCode == 13))"上
这确实阻止了在enter键上提交表单，但也阻止了enter键在form字段中完全工作。我想要实现的是，当我在TextArea中按enter键时，它会创建一个newLine，但是当我在input type="text"中单击enter时，它不会提交表单。
使用JSF 2.3
JQuery解决方案也可以。
回答 3
Stack Overflow用户
回答已采纳
发布于 2017-11-13 14:01:09
您可以测试聚焦的元素是否不是您的textarea，如下所示：
var area = document.getElementById('area');
document.getElementById('doesntSubmit').addEventListener('keydown', function (e) {
if (e.keyCode === 13 && e.target !== area) {
e.preventDefault();
}
});<form id="doesntSubmit">
<input type="text" value="whatever"/>
<textarea id="area"></textarea>
</form>
或者可以向不想受影响的元素中添加一个data-标记，或者添加一个特定的类.以避免检查标签。
您还可以向元素中添加一个css class，这些元素不应该在enter上提交表单，并在其上绑定事件处理程序：
$('.doesntSubmit').keydown(function (e) {
if (e.keyCode === 13) {
e.preventDefault();
}
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<input type="text" class="doesntSubmit" value="whatever"/>
<textarea id="area"></textarea>
</form>
Stack Overflow用户
发布于 2017-11-13 14:08:23
获取按键事件，然后检查specialClass是否不是:焦点并检查按下的键(13 = Enter键)
$(document).keypress(function(e) {
if(!$(".specialClass").is(":focus")){
e.preventDefault();
if(e.which == 13) {
console.log('You pressed enter!');
}
}
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="#" method="post">
<textarea name="text" class="specialClass">Text</textarea><br>
<input type="submit">
</form>
Stack Overflow用户
发布于 2020-08-10 05:58:42
试试下面的代码：
if(event.keyCode === 13 && event.target.type !== 'textarea') {
event.preventDefault();
return false;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/47265926
复制相关文章
相似问题
腾讯云开发者
