如何防止输入键提交表单

How to prevent the Enter key to submit form

本文关键字：提交 表单 输入 何防止      更新时间：2023-09-26

我的页面上有一个输入字段（类型=文本）。我使用Bootstrap并设置字段样式，我使用下一个html代码：

<form fole="form">
    <div class="form-group">
        <input type="text" class="form-control" id="add-bookmark" value placeholder="Enter URL">
    </div>
</form>

在流星应用程序中，我有事件处理程序：

Template.new_bookmark.events({
    // add new bookmark
    'keyup #add-bookmark' : function(e,t) {      
      console.log(e.which);
      if(e.which === 13)
      {

当我按下输入字段中的任何按钮时，我会在控制台中得到键代码（如我所愿）。 但是，如果我按回车键，控制台日志将没有任何内容，并且我的页面将重新加载。

看起来我问题的原因是在表单标签中。 如果我删除它，一切正常。 我需要做什么？ 删除表单标签或防止在我按回车键时重新加载页面？ 如果答案是第二，我该怎么办？

页面没有被"重新加载"，而是正在提交，这是当您专注于表单（选择表单中的输入字段）并按 Enter 时的默认行为。如何防止这种情况，好吧，将其添加到您的表单偏角中：

<form name="myForm" onsubmit="return false;">

或者，如果您想在提交之前验证输入字段，则可以使用单独的函数为您进行验证：

<form name="myForm" onsubmit="return validate();"> 
function validate()
{
  //pur you validation code here
  return true;
}

至于密钥日志，实际上你会在你的日志中输入，但问题是，当你点击 Enter 时，你的 brwoser 要做的第一个动作是提交表格，因此将开始发送新的 http 请求并开始从服务器传输信息。发生这种情况时，您的浏览器插件（Firebug，控制台等）将停止片刻，并等待加载新页面。我不确定这有多准确，但这是我的理解。

相关文章：