重新加载页面的按钮不会重新加载页面答案

【问题标题】：Button to reload page does not reload page重新加载页面的按钮不会重新加载页面
【发布时间】：2021-12-29 06:34:42
【问题描述】：

我试图按下一个按钮来重新加载页面，但它不起作用，我不知道为什么

我正在使用车把，所以理论上所有这些代码都在<body>

中

它发送 "POST" 一切正常，唯一没有运行的是脚本

作为一点相关信息，我使用的是 Bootstrap 5。

<script>
const reload = document.getElementById('reload');

reload.addEventListener('click', _ => { 
    window.location.reload();
});
</script>

<div class="Things with little reference">

. . .

   <form action="/dashboard/" method="POST">
      <div class="form-group">
         <button id="reload" class="btn btn-success">ye!</button>
      </div>
   </form>

【问题讨论】：

标签： javascript html bootstrap-5 express-handlebars

【解决方案1】：

按钮的默认类型是"submit"，它将提交表单。

对于这种情况，您应该将按钮类型更改为“按钮”或使用 preventDefault 来停止单击按钮的默认行为。

将按钮类型更改为“按钮”

  <button type="button" id="reload" class="btn btn-success">ye!</button>

或使用 preventDefault

reload.addEventListener('click', e => { 
    e.preventDefault()
    window.location.reload();
});

【讨论】：

当我设置type="button" 时，单击时没有任何反应，如果我没有设置类型，至少它会发送 POST 但它不会刷新我有还尝试了其他方法，例如改变 script 但没有任何效果

【解决方案2】：

不用JS，直接在按钮中指定即可。

<button onClick="window.location.reload();" class="btn btn-success" >ye!</button>

【讨论】：

对我不起作用，不刷新页面

【解决方案3】：

提交表单后可以从onSubmit事件中调用重新加载方法。

<button type="button" onClick="onSubmit()">Close</button>

<script>
function refreshPage(){
    window.location.reload();
} 
onSubmit()
{
   /*Here you can add your code for submit event*/
   this.refreshPage();
}
</script>

【讨论】：