在“提交”按钮上意外提交

Question

如果我将“提交”按钮设为活动状态（带有“ Tab”按钮），然后按Enter ，则按键处理程序将触发，并在按钮上生成click事件。 但是OnClick和Submit处理程序将不会触发。 它只会以静默方式发布表单。 为什么？

<script src="../js/jquery.js" type="text/javascript"></script>
<script type="application/javascript">

$().ready(function(){
     $("#f1").keypress(function(event) {
          if (event.keyCode==13){
            var currentInputId = $(event)[0].target.id;
            var currentInput = $('#'+currentInputId);
            currentInput.click();
            return false;
          }
      });


  $("#f1").submit(function(){
   alert ("huy")
  })
})
</script>
<form name="f1" id="f1" method="POST">
<input type="text">
<input type="submit" onclick="return false;" id="submit">
</form>

Answer 1

从头开始重写答案

在我的机器上，您的情况发生了什么（在提交按钮上移动输入，然后按Enter）：

• keypress处理程序运行并调用click该按钮
• 按钮onclick返回false
• 事件处理停止（未提交表单）

如果我删除onclick="return false;" ， 然后：

• keypress处理程序运行并调用click该按钮
• 提交表单时不会调用submit处理程序

其他一些测试表明*不会调用* submit处理程序，因为您从keypress处理程序返回false 。

因此，要解决此问题：

1. 删除onclick="return false;" 从按钮
2. 从keypress处理程序中删除return false

这将显示警报，然后按您期望的方式提交表单。