JavaScript表单验证。没有错误讯息。没有弹出窗口

Question

我需要一些帮助来使JS表单验证正常工作。

我在html头中链接到的.js脚本文件中有表单规则。

for规则示例：

    function IsValid4DigitZip( str ) {
    // Return immediately if an invalid value was passed in
    if (str+"" == "undefined" || str+"" == "null" || str+"" == "")  
        return false;

    var isValid = true;

    str += "";

    // Rules: zipstr must be 5 characters long, and can only contain numbers from
   // 0 through 9
   if (IsBlank(str) || (str.length != 4) || !IsInt(str, false))
        isValid = false;

   return isValid;
} // end IsValid4DigitZip

这是我的html：

    <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>orderbooks</title>
<link rel="stylesheet" href="styles.css">
<script src="datavalidation.js"></script>
<script type="text/javaScript">
function validate(orderbooks){
var digits="0123456789" 
var temp 

if ( IsValid4DigitZip(document.orderbooks.Postcode.value) ) {
  // Zip code is valid
} else {
alert("Invalid postcode:)
  // Zip code is invalid
}
return true 
} 
</script>
</head>
<body>
   <form name="orderbooks" onSubmit="return validate(orderbooks)" >
    Name: <input type="text" size="20" name="Name">
    Street Number:  <input type="text" size="5" name="streetnumber" maxlength="5">
    Street Name: <input type="text" size="20" name="streetname" maxlength="25">
    Postcode: <input type="text" size="4" name="postcode" maxlength="4">
    Telephone: <input type="text" size="11" name="telephone" maxlength="11">
    Email: <input type="text" size="20" name="email" maxlength="50">
    <input type="reset" value="Clear the Form">
    <input type="submit" value="Submit Form">
</form>
</body>
</html>

我究竟做错了什么？ 我无法显示警报或警告。

确定，我得到了处理错误消息的邮政编码！ 我有另一个问题。

如果要添加此表单验证规则：

    function IsNum( numstr ) {
    // Return immediately if an invalid value was passed in
    if (numstr+"" == "undefined" || numstr+"" == "null" || numstr+"" == "") 
        return false;

    var isValid = true;
    var decCount = 0;       // number of decimal points in the string

    // convert to a string for performing string comparisons.
    numstr += "";   

    // Loop through string and test each character. If any
    // character is not a number, return a false result.
    // Include special cases for negative numbers (first char == '-')
    // and a single decimal point (any one char in string == '.').   
    for (i = 0; i < numstr.length; i++) {
        // track number of decimal points
        if (numstr.charAt(i) == ".")
            decCount++;

        if (!((numstr.charAt(i) >= "0") && (numstr.charAt(i) <= "9") || 
                (numstr.charAt(i) == "-") || (numstr.charAt(i) == "."))) {
        isValid = false;
        break;
        } else if ((numstr.charAt(i) == "-" && i != 0) ||
                (numstr.charAt(i) == "." && numstr.length == 1) ||
              (numstr.charAt(i) == "." && decCount > 1)) {
        isValid = false;
        break;
      }                                
//if (!((numstr.charAt(i) >= "0") && (numstr.charAt(i) <= "9")) || 
   } // END for   

    return isValid;
}  // end IsNum

我可以直接在第一个函数规则下在html中键入以下内容来添加它：

     if (IsNum(document.orderbooks.querySelectorAll("[name=postcode]")[0].value)) {
    // Zip code is valid
  } else {
    alert("Postcode invalid! Please use only numbers:");
    return false;
  }

那是我会怎么做的吗？

Answer 1

您的代码中有两个问题：

警报缺少双引号。
发送到IsValid4DigitZip的邮政编码值错误。

更换

document.orderbooks.Postcode.value

与

document.orderbooks.querySelectorAll("[name=postcode]")[0].value

更新了validate功能代码：

function validate(orderbooks) {
  var digits = "0123456789"
  var temp

  if (IsValid4DigitZip(document.orderbooks.querySelectorAll("[name=postcode]")[0].value)) {
    // Zip code is valid
  } else {
    alert("Invalid postcode:");
    return false;
  }
  return true
}

  function validate(orderbooks) { var digits = "0123456789" var temp if (IsValid4DigitZip(document.orderbooks.querySelectorAll("[name=postcode]")[0].value)) { // Zip code is valid } else { alert("Invalid postcode:"); return false; } return true } function IsValid4DigitZip(str) { // Return immediately if an invalid value was passed in if (str + "" == "undefined" || str + "" == "null" || str + "" == "") return false; var isValid = true; str += ""; // Rules: zipstr must be 5 characters long, and can only contain numbers from // 0 through 9 if ((str.trim().length != 4) || !isNumeric(str.trim())) isValid = false; return isValid; } // end IsValid4DigitZip //Check for numbers function isNumeric(n) { return !isNaN(parseFloat(n)) && isFinite(n); }

 <form name="orderbooks" onSubmit="return validate(orderbooks)"> Name: <input type="text" size="20" name="Name"> Street Number: <input type="text" size="5" name="streetnumber" maxlength="5"> Street Name: <input type="text" size="20" name="streetname" maxlength="25"> Postcode: <input type="text" size="4" name="postcode" maxlength="4"> Telephone: <input type="text" size="11" name="telephone" maxlength="11"> Email: <input type="text" size="20" name="email" maxlength="50"> <input type="reset" value="Clear the Form"> <input type="submit" value="Submit Form"> </form>

JavaScript表单验证。没有错误讯息。没有弹出窗口

问题描述

1 个解决方案

解决方案1
0 2017-09-10 04:43:05

JavaScript表单验证。 没有错误讯息。 没有弹出窗口

问题描述

1 个解决方案

解决方案1 0 2017-09-10 04:43:05

JavaScript表单验证。没有错误讯息。没有弹出窗口

解决方案1
0 2017-09-10 04:43:05