如何使用正則表達式驗證 SSN

Question

我已經為它完成了大部分代碼，但出於某種原因，它只是提交了我的表單而不做任何事情。 我正在嘗試驗證 SSN，無論他們輸入時不帶破折號還是帶破折號。 除了驗證它我想改變文字的顏色和輸入的背景，如果它是無效的。 我的類名和 ID 設置正確，在我的 CSS 中，我使用input.invalid 、 label.invalid等來更改顏色。 這是我的 JS 代碼。 任何幫助都會很棒，謝謝！

    window.onload = function () {

document.forms[0].onsubmit = validForm;

    }

 function validForm () {

var allTags = document.forms[0].getElementsByTagName("*");

for(vari = 0; i < allTags.length; i++) {
    
    validTag(allTags[i]);
    
}

return false;

function validTag(thisTag) {
    
    var outClass = "";
    
    var allClasses = thisTag.className.split(" ");
    
    for(var j = 0; j < allClasses.length; j++) {
        
        outClass += validBasedOnClass(allClasses[j]) + " ";
        
    }
    
    thisTag.className = outClass;
    
    if(outClass.indexOf("invalid") > -1) {
       
        invalidLabel(thisTag.parentNode);
        
        thisTag.focus();
        
        if(thisTag.nodeName == "INPUT") {
           
           thisTag.select();
           
        }
       
    }
    
    function validBasedOnClass(thisClass) {
        
        var classBack = "";
        
        switch(thisClass) {
                
            case "":
                
            case "invalid":
                break;
                
            case "Social":
                
                if(!validSocial(thisTag.value)) {
                   
                    document.getElementById("socialNum").className = ("invalid");
                    
                    document.getElementById("ssn").className = ("invalid");
                    
                   classBack = "invalid ";
                   
            }
                break;
                
            default:
                
                classBack += thisClass;
                
        }
        
        return classBack;
        
    }
    
    function validSocial(social) {
        
        var re = /^\d{3}-?\d{2}-?\d{4}$/;
        
        var socialArray = re.test(social);
        
        if(socialArray) {
            
            document.getElementById("socialNum").value = socialArray[1] + "-" + socialArray[2] + "-" + socialArray[3];
            
            return true;
           
        }
        
        return false;
        
    }
    
    function invalidLabel(parentTag) {
        
        if(parentTag.nodeName == "LABEL") {
           
            parentTag.className += "invalid";
           
           }
        
    }
    
}

}

這是我要求的 HTML 代碼

    <!DOCTYPE html>

COP2831：第 7 章 - 正則表達式

正則表達式 - 凱文泰勒

輸入社會安全號碼：

Answer 1

由於您的樣本不完整，而且我真的不明白您為什么這樣做，我只是提供了一個簡化的 SSN 驗證工作樣本。

window.onload = function () {
    document.forms[0].onsubmit = validForm;
};
function validForm() {
    var ssnTag = document.getElementById("socialNum");
    var re = /^\d{3}-?\d{2}-?\d{4}$/;
    var valid = re.test(ssnTag.value);
    if (valid) {
        ssnTag.style.borderColor = "green";
    } else {
        ssnTag.style.borderColor = "red";
    }
    return false;
}

JSFiddle

如何使用正則表達式驗證 SSN

問題描述

正則表達式 - 凱文泰勒

1 個解決方案

解決方案1
1 已采納 2017-10-01 19:56:20

如何使用正則表達式驗證 SSN

問題描述

正則表達式 - 凱文泰勒

1 個解決方案

解決方案1 1 已采納 2017-10-01 19:56:20

解決方案1
1 已采納 2017-10-01 19:56:20