0

我一直在开发我的第一个网站，但遇到了 javascript 验证脚本的问题。我的代码：

<html>
    <head>
      <title>Territory</title>
    </head>
    <body>

      <script type="text/javascript"> //Main Javascript function giving me issues
    function validate(form)
    {
      fail = validateTerrNum(document.checkOut.numberOut.value);
      fail += validateFirstName(document.checkOut.fName.value);
      fail += validateLastName(document.checkOut.lName.value);
      if (fail == "") 
    return true;
      else 
      {
        alert(fail);
        return false;
      }
    }
        </script>
        <script type="text/javascript>
        function validateTerrNumber(field)
        {
     if (field == "") return "No territory number was entered. \n";
     else if (field.length > 3)
    return "Territory numbers must be less than four characters. \n";
    else if (/[^0-9]/.test(field))
        return "Only 0-9 allowed in territory number. \n";
    return "";
        }

        //Note: Does not sanitize string
        function validateFirstName(field)
        {
     if (field == "") return "No first name was entered. \n";
     return "";
        }

        //Again, note that this function does not sanitize string
        function validateLastName(field)
        {
     if (field == "") return "Not last name was entered. \n";
     return "";
        }
        </script>

        <table border="0" cellpadding="2" cellspacing="5">
     <th colspan="2" align="center">Check Out</th>
      <form name="checkOut" method="post" onSubmit="validate(this)"> 
    <tr><td>Territory Number</td><td><input type="text" name="numberOut"     tabindex="1" maxlength="3" size="3" /></td>
                    </tr><tr><td>First Name of Holder</td><td><input type="text" name="fName" tabindex="2" maxlength="15"/></td>
                    </tr><tr><td>Last Name of Holder</td><td><input type="text" name="lName" tabindex="3" maxlength="15" /></td>
                    </tr><tr><td><input type ="checkbox" name="specialC" tabindex="4" value="Yes"/> Special Campaign</td>
                    </tr><tr><td></td><td><input type="submit" value="Check Out" /></td>
                </form>
            </table>
</body>
</html>

它显然格式不正确 - 复制和粘贴的结果。更具体地说，这个问题与 javascript 验证有关。当我点击“签出”时，当我输入错误值时，验证不会阻止它。该脚本非常简单，但由于某种原因，我无法弄清楚它发生了什么（我对javascript相当陌生）。

我知道问题不在于我的浏览器，因为我在其中运行了许多 javascript。我唯一能想到的是表单没有方法。这将是另一个验证，但用 php 编写 - javascript 实际上只是客户端的预验证。

任何帮助，将不胜感激。

-Mlagma

4

2 回答 2

1

要在验证失败后停止提交，您需要：

onSubmit="return validate(this)"

而不是您当前的代码：

onSubmit="validate(this)"

您的validate()函数已经返回trueor false，但这些值并未从事件处理程序本身返回。如果您将引号之间的代码onSubmit=""视为函数的主体，这是有道理的。

而且，正如 Teemu 指出的那样，您的validate()函数会尝试调用一个调用的函数validateTerrNum，而实际上您已经将该函数声明为validateTerrNumber.

纠正这些问题后，您可以看到它在这里工作：http: //jsfiddle.net/nnnnnn/Wvcy3/

于 2012-08-15T05:30:41.070 回答
0

你有这条线validate()：

fail = validateTerrNum(document.checkOut.numberOut.value);

还有这个功能：

function validateTerrNumber(field){...

document.checkOut也不是undefined元素（依赖于浏​​览form器？？？），最好改为使用document.getElementById('numberOut').value，（与fNameand相同lName）。当然，您需要id在 HTML 中添加这些 s。

于 2012-08-15T05:30:16.107 回答