使用 javascript 表单获取多个 getElementById

Question

我必须使用 javascript 创建一个表单，如果字段为空，return 会内联显示一条消息错误。在我下面的代码中，只有第一个运行，我无法设置邮政编码。（我不允许使用Jquery）感谢您的宝贵时间

function checkForm() {
    document.getElementById("frm1").onsubmit = function() {
        if (document.getElementById("lastname").value === "") {
            showError();
            return false;
        } else {
            return true;
        }
    }
}

function checkForm() {
    document.getElementById("frm1").onsubmit = function() {
        if (document.getElementById("postCod").value === "") {
            showError();
            return false;
        } else {
            return true;
        }
    }
}

function showError() {
    document.getElementById("error").style.display = "inline";
}
window.onload = checkForm;

Answer 1

我会像这样将两个功能合并为一个：

function checkForm() {
    document.getElementById("frm1").onsubmit = function() {
        if (document.getElementById("lastname").value === "") {
            showError();
            return false;
        } else if (document.getElementById("postCod").value === "") {
            showError();
            return false;
        } else {
            return true;
        }
    }
}

Answer 2

您需要将其从 onsubmit 更改为 addEventListener。这是因为使用 .onsubmit 就像一个对象属性当您将它设置为等于它覆盖值的东西时。使用 addEventListener 允许您将多个函数绑定到同一事件。

var form = document.getElementById("frm1")

form.addEventListener("submit", function () {
  // do something
})

Answer 3

实际上你只能有一个函数和多个 if-else 语句。

   function checkForm() {
    document.getElementById("frm1").onsubmit = function() {
        if (document.getElementById("lastname").value === "") {
            showError();
            return false;
        } else  if (document.getElementById("postCod").value === "") {
            showError();
            return false;
        } else {
            return true;
        }
    }
 }

function showError() {
    document.getElementById("error").style.display = "inline";
}
window.onload = checkForm;

使用 javascript 表单获取多个 getElementById

Get multiple getElementById using javascript form

javascript

forms

getelementbyid