Javascript 如何防止表单输入在收到'Enter'键时重新加载页面

我有一个HTML5表单，如下所示，它使用Bootstrap3设计样式，包含一个

范围

输入和一个

数字

输入。这两个输入是链接的，因此每当我更改

范围

值时，

编号

输入就会更新，反之亦然

困扰我的是，当我更改

number

输入值并点击

Enter

键时，整个网页都会重新加载，这会抹掉用JavaScript加载到页面中的所有其他数据

我的问题是，如何更改HTML/代码以禁用这种重新加载行为

谢谢

    <form class="form-horizontal">
        <div class="form-group">
            <div class="col-xs-6">
                <input type="range" class="policy_slider" name="demandRange" min="0.1" max="10" value="1" oninput="this.form.demandInput.value=this.value"/>
            </div>
            <div class="col-xs-1">
                <input type="number" name="demandInput" min="0.1" max="10" value="1" step="any" oninput="this.form.demandRange.value=this.value"/>
            </div>
        </div>
    </form>

---

您必须使用Ajax提交表单- 否则，停止表单提交非常简单：

$("#yourForm").submit(e){
  e.preventDefault();
}

---

您可以使用以下代码阻止enter键提交表单

<script type="text/javascript">

function stopRKey(evt) {
  var evt = (evt) ? evt : ((event) ? event : null);
  var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
  if ((evt.keyCode == 13))  {return false;}
}

document.onkeypress = stopRKey;

</script>

功能停止键（evt）{
var evt=（evt）？evt:（（事件）？事件：空）；
var节点=（evt.target）？evt.target:（（evt.srcement）？evt.srcement:null）；
如果（（evt.keyCode==13））{return false；}
}
document.onkeypress=stopRKey；

---

我在链接中找到了它，该链接显示了当输入字段是文本字段时如何执行该操作。我删除了该部分，它将在所有字段上阻止它。

将表单提交设置为使用javascript并“返回false”。之后，您可以使用另一个函数进行实际提交

<form class="form-horizontal" onSubmit="return false;">

---

jsiddle:

由于已经有简单的旧JS解决方案，我的答案基于JQuery。此外，引导JS需要Jquery。所以试试这个：

$("form").keypress(function(e) {
  //Enter key
  if (e.which == 13) {
    return false;
  }
});

如果页面中有多个表单，请使用以下选项：

 $("#form_id").keypress(function(e) {
      //Enter key
      if (e.which == 13) {
        return false;
      }
    });

其中，

form\u id

是为表单指定的id，如下所示：

…

---

礼貌：

这将帮助您避免提交表单

---

如果不需要表单提交，请尝试删除表单，并在需要时使用Ajax。

OP根本不希望表单提交。请注意，这应该处理preventDefault（），因为这是最干净的方式为什么要进行否决？e.preventDefault（）是否将“根本”停止表单的提交使用preventDefault（）而不是return False应该使用preventDefault（）而不是returnfalse@VelimirTchatchevsky使用preventDefault（）对我来说毫无用处，因为返回false至少可以阻止提交。感谢所有帮助过我的人。我使用了

return false

解决方案，因为它很短。但其他人也很可能起作用。