重定向到另一个 HTML 页面在 Javascript 表单提交事件监听器中不起作用

发布于05月02日

下面是JS代码:

let form = document.querySelector("form");

form.addEventListener("submit", (e) => {
      const map_not_uploaded = document.getElementById("map").value == "";
      const bugs_not_uploaded = (document.getElementById("bug1").value == "") || (document.getElementById("bug2").value == "");

      if (map_not_uploaded) {
            alert("Must upload map file");
            e.preventDefault();
      }
      else if (bugs_not_uploaded) {
            alert("Must upload both bug files");
            e.preventDefault();
      }
      else {
            window.location.href = "new.html";
      }
});

说

提交表单后，它会正确判断是否输入了文件，即显示alert .然而，在正确输入之后，它不会重定向到new.html.

推荐答案

只需将e.preventDefault()放在函数的顶部即可.

form.addEventListener("submit", (e) => {
  e.preventDefault();
  const map_not_uploaded = document.getElementById("map").value == "";
  const bugs_not_uploaded = (document.getElementById("bug1").value == "") || (document.getElementById("bug2").value == "");

  if (map_not_uploaded) {
        alert("Must upload map file");
  }
  else if (bugs_not_uploaded) {
        alert("Must upload both bug files");
  }
  else {
        window.location.href = "new.html";
  }
  });