如何防止我的页面在提交javascript表单时刷新

Question

我有一个问题，我似乎无法解决。我正在创建一个性格测试，当我提交表单时，暂时在“答案框”中，它将显示代码，但随后快速刷新页面并清除所有数据。我想知道问题是否与我的javascript函数“tabulateanswers”正在中断，但我看不到什么会导致它。我之前在javascript中添加了一个弹出框来尝试强制停止刷新，我可以看到结果是否显示，但经过一些调整后，我也无法再显示此框。如果有人可以看看我的javascript，给我指出正确的方向/告诉我哪里错了？道歉，如果这个问题已经得到回答，我无法找到它搜索。

Answer 1

如果您调用onsubmit，您将能够在它结束时阻止此行为tabulateAnswersreturn false;

由于您使用的是 onclick，因此您还需要防止默认操作发生，如下所示：

function tabulateAnswers(_event) {

    ...

    _event.preventDefault();

    return false;

}

另一种选择是改用不触发表单提交的输入类型。button

Answer 2

只需使用jQuery：

<form id="form">

  <input type="submit" value="Submit" />

</form>

<script>

$("#form").submit(e => {

  e.preventDefault();

  // Handle form

});

</script>