Javascript Alertify警报在弹出后立即消失

我已经构建了一个express应用程序，最后，我为应用程序中的一个删除按钮添加了一个警报。但是，警报在我单击“确定”之前就消失了

这是我的删除表

<form
  action="/grades/<%=grade._id%>?_method=DELETE"
  method="POST"
  class="delete-form"
>
  <input
    type="submit"
    class="btn btn-danger mt-3"
    value="Delete Class"
    id="delBotton"
  />
</form>

最后，这是我的删除路线：

router.delete('/:id', middleware.checkGradeOwnership, (req, res) => {
  Grade.findByIdAndRemove(req.params.id, (err) => {
    try {
      res.redirect('/grades');
    } catch (err) {
      res.redirect('/grades');
      console.log(err);
    }
  });
});

---

如何修复此问题？

由于您的输入具有

type=“submit”

默认情况下，它将提交表单。为了防止这种默认行为，您可以在单击处理程序中调用

e.preventDefault（）

，或者更适当地将输入设置为

type=“button”

，因为您不打算使用此按钮提交表单。接下来，库alertify似乎有一个事件，您可以使用该事件检查用户是否已确认，然后在用户按下OK后，您可以使用该事件手动调用表单的submit函数，有关工作示例，请参阅下面的可运行代码段：

const delForm=document.getElementById（'delForm'）；
const delBtn=document.getElementById（'delBotton'）；
delBtn.addEventListener（'单击'，（）=>{
alertify.alert（'这是一个警报对话框'，（）=>{
alertify.message（'OK'）；
}).set（{'invokeOnCloseOff'：true，'onok'：（）=>delForm.submit（）}）
});

显然，您在发布表单和发布警报时使用了相同的按钮。因此，表单被发布，然后您尝试发布警报。同时，服务器通过发送重定向来响应表单，因此当浏览器收到重定向时，它会立即关闭您的警报并加载新页面。在用户点击“确定”按钮之前，您不需要发布表单。非常感谢……这很有帮助
router.delete('/:id', middleware.checkGradeOwnership, (req, res) => {
  Grade.findByIdAndRemove(req.params.id, (err) => {
    try {
      res.redirect('/grades');
    } catch (err) {
      res.redirect('/grades');
      console.log(err);
    }
  });
});