简单Javascript表单验证代码问题

基本上，我正在尝试编写一些用于表单验证的代码，我对此很陌生，但我想我的管理还可以吗？我的问题基本上是这样的，我已经为表单中的3个输入创建了3个验证方法，但我不太确定如何将所有3个方法添加到单击一个按钮中

到目前为止，我的代码是：

function validation() {
  function validateName() {
    console.log("reaching here");

    var name = document.getElementById("full_name");

    if (name.value.length == 0) {
      document.getElementById("okName").className = "fail";
    }else{
      document.getElementById("okName").className = "success";
    }
  }//End of validate name

  function validateEmail() {
    var email = document.getElementById("email");

    if (email.value.length == 0) {
      document.getElementById("okEmail").className = "fail";
    }else{
      document.getElementById("okEmail").className = "success";
    }
  }//end of validate email

  function validatePhone() {
    var phone = document.getElementById("phone");

    if (phone.value.length == 0) {
      document.getElementById("okPhone").className = "fail";
    }else{
      document.getElementById("okPhone").className = "success";
    }
  }//End of validate phone
}//End of validation function

---

我还尝试从单个函数中删除所有验证方法，只在一个函数中使用它们，但这也不起作用？如果有人能告诉我哪里出了问题，那就太好了！提前干杯

您可以查看与以前类似的方法。

尝试将

onclick（）

事件附加到提交按钮-

验证
函数验证（）{
var name=document.getElementById（“全名”）；
如果（name.value.length==0）{
document.getElementById（“okName”）.className=“失败”；
警报（“错误1”）；
返回false；
}否则{
document.getElementById（“okName”）.className=“成功”；
}
var email=document.getElementById（“电子邮件”）；
如果（email.value.length==0）{
document.getElementById（“okEmail”）.className=“失败”；
警报（“错误2”）；
返回false；
}否则{
document.getElementById（“okEmail”）.className=“成功”；
}
var phone=document.getElementById（“电话”）；
if（phone.value.length==0）{
document.getElementById（“okPhone”）.className=“失败”；
警报（“错误3”）；
返回false；
}否则{
document.getElementById（“okPhone”）.className=“成功”；
}
警惕（“成功”）
}//验证函数结束

由于某些原因，这不会进入验证的第二阶段，它会在警报1停止吗？在控制台中查看它是否进入下一步后，我可以看到它甚至没有走那么远？如果第一次输入中有错误，它会返回false，从而停止功能的执行。好的，我现在看到了！谢谢你的帮助！！有什么办法可以让所有的检查同时完成吗？这并不是我想要做的，你看，我有两个图像出现在我的输入旁边，一个绿色的勾号表示成功，一个红色的X表示失败，所以当我点击提交时，当代码停止处理时，如果有错误，只有第一个红色的X出现，有什么方法可以让所有3个都在点击提交时显示，或者至少显示多少无效输入？谢谢你们的帮助！非常感谢！

<button onclick="validation();">validate</button>

<script>
function validation() {
    var name = document.getElementById("full_name");
    if (name.value.length == 0) {
      document.getElementById("okName").className = "fail";
        alert("error 1");
        return false;
    }else{
      document.getElementById("okName").className = "success";
    }

    var email = document.getElementById("email");
    if (email.value.length == 0) {
      document.getElementById("okEmail").className = "fail";
        alert("error 2");
        return false;
    }else{
      document.getElementById("okEmail").className = "success";
    }

    var phone = document.getElementById("phone");
    if (phone.value.length == 0) {
      document.getElementById("okPhone").className = "fail";
        alert("error 3");
        return false;
    }else{
      document.getElementById("okPhone").className = "success";
    }

    alert("success")
}//End of validation function
</script>