如何防止输入键按键提交网页表单?

2022-08-30 00:58:15

如何防止按键在基于 Web 的应用程序中提交表单?ENTER


答案 1

[修订版 2012,无内联处理程序,保留文本区域输入处理]

function checkEnter(e){
 e = e || event;
 var txtArea = /textarea/i.test((e.target || e.srcElement).tagName);
 return txtArea || (e.keyCode || e.which || e.charCode || 0) !== 13;
}

现在,您可以在表单上定义一个按键处理程序:
<form [...] onkeypress=“return checkEnter(event)”>

document.querySelector('form').onkeypress = checkEnter;

答案 2

这是一个jQuery处理程序,可用于停止输入提交,并停止退格键 ->返回。“keyStop”对象中的 (keyCode: selectorString) 对用于匹配不应触发其默认操作的节点。

请记住,网络应该是一个可访问的地方,这打破了键盘用户的期望。也就是说,在我的情况下,我正在处理的Web应用程序无论如何都不喜欢后退按钮,因此禁用其键快捷方式是可以的。“应输入 ->提交”的讨论很重要,但与实际提出的问题无关。

这是代码,由您来考虑可访问性以及为什么您实际上想要这样做!

$(function(){
 var keyStop = {
   8: ":not(input:text, textarea, input:file, input:password)", // stop backspace = back
   13: "input:text, input:password", // stop enter = submit 

   end: null
 };
 $(document).bind("keydown", function(event){
  var selector = keyStop[event.which];

  if(selector !== undefined && $(event.target).is(selector)) {
      event.preventDefault(); //stop event
  }
  return true;
 });
});