确保用户在JavaScript表单中提交的邮政编码不能少于5个数字

Making sure that a user can't submit less than 5 numbers for zip code in a JavaScript form

本文关键字:不能 邮政编码 数字 5个 提交 用户 JavaScript 表单 确保      更新时间:2023-09-26

我正在构建一个注册表单,我需要一种方法来防止用户提交少于5个数字的邮政编码。当我完全注释掉else if的尝试时,另一个函数(确保用户不会提交任何字母)就可以工作了。我在结束时使用返回false,以便表单不会提交,我可以测试坏的输入。抱歉缺乏jsfiddle -它不会让我提交表格的某些原因(我是一个新手,所以这可能是原因)。下面是我的代码片段:

HTML:

<form name="reg" onSubmit="return formValidation();">    
<p>Zip Code: <input type="text" id="zip" maxlength="5" name="zip"></p>
<input type="submit" id="submitbutton" name="submitbutton" value="Submit" />
<div id="msg"></div> 
</form>

JS:

function formValidation()  
{  
    var zip = document.reg.zip; 
    allnumeric(zip);
function allnumeric(zip)
{   
    var numbers = /^[0-9]+$/;  
    if(zip.value.match(numbers))  
    {  
        document.getElementById("msg").innerHTML=("OK &#x2713;");
        msg.style.color="green";
    }  
    else if (zip.numbers < 5) /*DOES NOT COMPUTE*/
    {
        msg.innerHTML=("Has to be 5 numbers.");
        msg.style.color="red";
    }
    else
    {  
        msg.innerHTML=("Numbers only please.");
        msg.style.color="red";
    }  
};  
    return false;
};

我建议接受HTML5

<form name="reg" onSubmit="return formValidation();">
    <p>Zip Code:
        <input type="text" id="zip" pattern="'d{5}" maxlength="5" name="zip" required="required" />
    </p>
    <input type="submit" id="submitbutton" name="submitbutton" value="Submit" />
    <div id="msg"></div>
</form>

小提琴

您想要zip.value.length,而不是zip.numbers

你也可以用正则表达式:

var numbers = /^'d{5}$/;  
if(zip.value.match(numbers))  
{  
    document.getElementById("msg").innerHTML=("OK &#x2713;");
    msg.style.color="green";
}  
else
{  
    msg.innerHTML=("Numbers only please.");
    msg.style.color="red";
} 

我认为其他答案涵盖了你的JS问题的本质,但不是真正的数据质量方面,因为我不认为你真的应该以这种方式验证zip。

你当然采取了正确的方法来确保用户输入的质量——但仅仅检查5个数字可能是不够的。

有成千上万的地址,其中4或3位数的邮政编码应该被认为是有效的输入-其中zip以一个或两个0开头。一些例子包括:

  • Bridgeton, NJ 08302
  • Holtsville, NY 00544
  • 附件,PR 00601(波多黎各所有邮政编码以00开头)
  • Christiansted, VI 00821

用户经常忽略前面的00/0,这在你的表单中是应该被允许的——如果用户在知道错误的情况下得到方便的内联验证消息,告诉他们错误,他们可能会发现这是一个不愉快的干扰。

第二个可能的缺陷(同样取决于您的工作流程)是人们也可能输入zip+4。当你可能得到完整的9个时,你可能不想把它们限制在5个。

这意味着你的JS测试将不得不更新,以允许组合,但会导致一个更健壮的最终产品。至少,我建议作为表单的一部分,您包括示例邮政编码(占位符文本或类似),其中包括'00'大小写,以便用户知道期望的是什么。要允许输入可选的+4,请将正则表达式更新为:

var numbers = ^'d{5}(-'d{4})?$;  
if(zip.value.match(numbers))  
{
    ....
}
else
{
    ...
}

最后,确保您捕获正确的邮政编码并将其与地址正确关联的最终方法是验证整个内容(无论邮政编码的长度如何)。这些验证服务,你可以自己制作和维护或使用第三方(如我的公司- http://www.qas.com/products/on-demand-address-validation.htm)可以加快捕获一个地址,并确保它是有效的-处理3,4或5位数的zip,增强地址与缺失的+4,纠正拼写错误的zip或其他地址元素。

希望有帮助,祝你好运!