JavaScript多输入验证

Question

我试图验证Surname必需字段，NIC应该只在Numbers中。 但问题是这段代码没有检查NIC。

<script>
  function validateform(SnameAddress,mail,NIC,dob){
    var required=""
    if(document.getElementById("Sname").value == ""){
      alert("Surname : field is required");
      return false;
    }
  }

  function validateNIC(NIC){
    var nic=document.getElementById("NIC").value;
    if(isNaN(nic)){
      alert("NIC : incorrect NIC num"); 
      return false;
    }
  }

</script>

<form action="MAILTO:info@example.com" method="post" enctype="text/plain" action="#"
onsubmit="return (validateform() && validateNIC())">

  Surname <input type="text" id="Sname" >
  NIC <input type="text" id="NIC">
</form>

Answer 1

逻辑AND操作'&&'采用短路行为，这意味着如果第一个条件没有返回true，它将不会检查第二个条件。 所以我们在这里有两个条件：

• 如果Sname.value等于“”，则validateform()返回false，然后AND操作不会检查seocnd条件，也不会进入validateNIC()函数。
• 如果Sname.value不等于“”，则validateform()不会返回true，那么AND操作也不会检查seocnd condtion

所以你可以添加return ture; 在validateform()的末尾，但如果Sname.value不相等，这将使您只输入validateNIC()

如果要检查两者，可以将所有验证放在同一个函数中：

<script>
  function validateform() {
    var isValid = true;
    if (document.getElementById("Sname").value == "") {
      alert("Surname : field is required");
      isValid = false;
    }
    var nic = document.getElementById("NIC").value;
    if (isNaN(nic)) {
      alert("NIC : incorrect NIC num");
      isValid = false;
    }
    return isValid;
  }
</script>
<form action="MAILTO:info@example.com" method="post" enctype="text/plain" action="#" onsubmit="return validateform()">
  Surname
  <input type="text" id="Sname"> NIC
  <input type="text" id="NIC">
</form>

Answer 2

在您的代码中，如果您没有从函数返回true，则其默认返回值为undefined，等于true。 这就是你的支票不起作用的原因。 如果您不想发送表单，则应该为这两个条件返回false。 我可以假设您没有很好地检查isNaN功能。 例如：

isNaN("123.0")
false
isNaN("123,0")
true

因此，尝试通过开发人员控制台（f12）使用isNaN内置函数来检查您的可能输入。 也许您需要在现有代码之上编写一些逻辑。

Answer 3

我想这是因为如果有效，你不会在validateform上返回true。 因此，在“和”（&&）条件下，当第一部分不为真时，没有理由检查条件的第二部分，因此不调用validateNIC。

Answer 4

第1步：如果您在函数中没有使用param，请将其删除。 function validateform(SnameAddress,mail,NIC,dob) - > function validateform()

function validateNIC(NIC) - > function validateNIC()

第2步：添加返回true（如@Dmitry Surin所述）

function validateform(){
   var required=""
   if(document.getElementById("Sname").value == ""){
       console.log("Surname : field is required");
       return false;
   } else {
       return true;
   }
}

function validateNIC(){
   var nic=document.getElementById("NIC").value;
   if(isNaN(nic)){
      console.log("NIC : incorrect NIC num"); 
      return false;
    } else {
        return true;
    }
}

JSFiddle： https ：//jsfiddle.net/xpvt214o/431790/