为什么我的邮政编码验证方法无法正常工作

Question

我有一个表单，它使用asp:requiredvalidator 和一些自定义 javascript 在任何未正确填写的字段周围应用红色 1px 边框。

这很好用，但现在我希望能够在用户正确填写字段时立即删除红色边框。

为此，我使用 Jquery 的 focusout() 方法将用户输入与正则表达式进行比较。到目前为止，我在除邮政编码之外的每个字段（包括电子邮件验证）上都能正常工作。出于某种原因，我编写的所有验证方法都可以正常工作，除了邮政编码。

这是一个有效的电子邮件验证示例

        if (id == "email1" || id == "email2") {
            emailValue = e.target.value;
            if (validateEmail(emailValue)) {
                $("#" + id).removeClass("ErrorControl");
            }
            else {

            }
        }

        function validateEmail(email) {
            var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
            return re.test(email);
        }

这非常有效，只要字段丢失焦点且电子邮件有效，红色边框就会消失。

但我无法让我的 zip 验证器正常工作，即使它的工作方式几乎完全相同。

这是不工作的 zip 示例

            //Zip code also require special validation to confirm
            if (id == "zip") {
                zipValue = e.target.value;
                if (validateZip(zipValue)) {
                    $("#" + id).removeClass("ErrorControl")
                }
            }

        //Simple zip validator
        function validateZip(zip) {
            var re = /^[0-9]{5}$/;
            return re.test(zip);
        }

不幸的是，即使我只在其中输入字母，它仍然会删除红色边框！为什么会这样？

https://jsfiddle.net/hhjvstp3/

因为我无法在 jsfiddle 上运行 asp 验证器，所以我已经给 email 和 zip 提供了一个 ErrorControl 类。这和我描述的完全一样。电子邮件验证良好，邮政编码无论如何都会删除边框。

Answer 1

Updated fiddle

您可以看到哪一行从 zip 中删除了 ErrorControl 类

 if (id == "firstname" || id == "lastname" || id == "address1" || id == "city" || id == "amount") { 
    //id == "zip" shouldn't be here
     if (e.target.value != "") {
          $("#" + id).removeClass("ErrorControl");
      }
 }