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

Question

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

我正在使用 handlebars，所以理论上所有这些代码都在 <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>

Answer 1

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

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

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

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

或使用 preventDefault

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

Answer 2

你可以直接在按钮中指定，而不是使用 JS。

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

Answer 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>

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

Button to reload page does not reload page

html

javascript

express-handlebars

bootstrap-5