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

ENTER键仅仅激活表单的默认提交按钮，这将是第一个

<input type="submit" />

浏览器在表单中查找。

所以不要有提交按钮，而是类似的东西

<input type="button" value="Submit" onclick="submitform()" />

编辑:回应评论中的讨论:

如果只有一个文本字段，这就行不通了——但在这种情况下，这可能是理想的行为。

另一个问题是，这依赖于Javascript来提交表单。从可访问性的角度来看，这可能是一个问题。这可以通过用javascript编写<input type='button'/>来解决，然后在<noscript>标签中放入<input type='submit' />。这种方法的缺点是，对于禁用javascript的浏览器，您将在ENTER时提交表单。在这种情况下，由OP决定期望的行为是什么。

我知道没有办法做到这一点而不调用javascript。

2009-02-25 10:29:08

这是一个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;
 });
});

2010-01-20 21:00:50

我认为，你可以在javascript的表单中捕获键下，防止冒泡。网页上的ENTER基本上只是提交当前所选控件所在的表单。

2009-02-25 09:59:39

防止“ENTER”提交表单可能会给一些用户带来不便。所以你最好按照下面的步骤来做:

在你的表单标签中写入'onSubmit'事件:

<form name="formname" id="formId" onSubmit="return testSubmit()" ...>
 ....
 ....
 ....
</form>

编写Javascript函数如下:

function testSubmit(){
  if(jQuery("#formId").valid())
      {
        return true;
      }
       return false;

     } 

     (OR)

不管是什么原因，如果你想阻止按Enter键提交表单，你可以用javascript写下面的函数:

    $(document).ready(function() {
          $(window).keydown(function(event){
          if(event.keyCode == 13) {
               event.preventDefault();
               return false;
              }
           });
         });

谢谢。

2012-10-05 06:52:22

简单地添加这个属性到你的FORM标签:

onsubmit="return gbCanSubmit;"

然后，在你的SCRIPT标签中，添加这个:

var gbCanSubmit = false;

然后，当你创建一个按钮或出于任何其他原因(比如在函数中)你最终允许提交时，只需翻转全局布尔值并执行.submit()调用，类似于下面的示例:

function submitClick(){

  // error handler code goes here and return false if bad data

  // okay, proceed...
  gbCanSubmit = true;
  $('#myform').submit(); // jQuery example

}

2013-03-08 23:33:19