0

基本上我正在尝试编写一些用于表单验证的代码，我对此很陌生，但我认为可以管理吗？我的问题基本上是这样的，我为表单中的 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

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

4

2 回答 2

1

尝试将onclick()事件附加到您的提交按钮 - http://jsfiddle.net/zWrUM/

<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>
于 2012-07-16T13:34:15.670 回答
0

你可以看看addEventListener和oldIE类似的方法。

于 2012-07-16T13:28:05.223 回答