Javascript 如何使用正则表达式验证SSN_Javascript_Regex

Javascript 如何使用正则表达式验证SSN

javascript regex

Javascript 如何使用正则表达式验证SSN,javascript,regex,Javascript,Regex,我已经为它完成了大部分代码，但出于某种原因，它只是提交了我的表单，没有做任何事情。我正在尝试验证SSN，无论他们是使用破折号输入还是使用破折号输入。除了验证它，如果输入无效，我还想更改单词的颜色和背景。我已经正确设置了我的类名和Id，并且在我的css中，我使用了诸如input.invalid、label.invalid等来更改颜色。下面是我的JS代码的内容。任何帮助都会很好，谢谢 window.onload = function () { document.forms[0].onsub

我已经为它完成了大部分代码，但出于某种原因，它只是提交了我的表单，没有做任何事情。我正在尝试验证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";

           }

    }

}

window.onload=函数（）{
document.forms[0]。onsubmit=validForm；
}
函数有效形式（）{
var allTags=document.forms[0].getElementsByTagName（“*”）；
对于（变量=0；i-1）{
invalidLabel（thisTag.parentNode）；
thisTag.focus（）；
if（thisTag.nodeName==“输入”）{
thisTag.select（）；
}
}
函数validBasedOnClass（thisClass）{
var classBack=“”；
开关（此类）{
案例“”：
案例“无效”：
打破
“社会”一案：
如果（！validSocial（thisTag.value））{
document.getElementById（“socialNum”）.className=（“无效”）；
document.getElementById（“ssn”）.className=（“无效”）；
classBack=“无效”；
}
打破
违约：
classBack+=此类；
}
返回类返回；
}
功能有效社会（社会）{
var re=/^\d{3}-？\d{2}-？\d{4}$/；
var socialArray=重新测试（社会）；
if（社会阵列）{
document.getElementById（“socialNum”）.value=socialArray[1]+“-”+socialArray[2]+“-”+socialArray[3]；
返回true；
}
返回false；
}
函数invalidLabel（parentTag）{
if（parentTag.nodeName==“标签”）{
parentTag.className+=“无效”；
}
}
}

}

这是我的html代码

    <!DOCTYPE html>


COP2831：第7章-正则表达式

正则表达式-Kevin Taylor
输入社会保险号码：

由于您的示例不完整，我不明白您为什么这样做，因此我只提供一个简化的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;
}

看一看。“寻求调试帮助的问题（“此代码为什么不起作用？”）必须包括所需的行为、特定的问题或错误以及在问题本身中重现该问题所需的最短代码。没有明确问题说明的问题对其他读者没有用。请参阅“我说明了所需的行为”。我需要它来验证ssn。以及更改标签和输入文本的颜色。这不是调试帮助，因为我的代码显然无法正常运行。我已经生成了大部分代码了吗？对我需要你帮我弄清楚为什么它不能验证。这是一个问题。没有调试。如果是拼写或语法错误，我不会在这里。“调试”不是“拼写或语法错误”。你的问题仍然是“为什么这不起作用”“验证ssn”不是“预期行为”的明确声明。请务必阅读链接的内容并相应地编辑你的问题。如果你花时间阅读这篇文章，它实际上并没有说“为什么这不起作用”，我只是在寻求代码方面的帮助。如果你不想帮助他们继续前进，请。因为我的帖子只是问我如何在使用正则表达式时使用ssn验证表单。没有其他方法可以问这个问题，因为我已经说过我的代码不会验证它，它在提交时没有检查它是否是有效的输入选项。我在我的帖子里有一个期望的行为，同样，如果你读了它，你可能会理解它。谢谢你，祝你愉快，先生。谢谢！我试着这样做的唯一原因是，我的大学书就是这样告诉我怎么做的。这本书似乎让事情变得更复杂了。谢谢你的帮助，这是工作。如果我在提交后输入像123456789这样的ssn，它会将其更改为123-45-6789吗？这有点困难。您可以将正则表达式与组一起使用，

/^（\d{3}）-？（\d{2}）-？（\d{4}）$/

从组$1、$2、$3收集值，再次将它们粘合在一起，并更新文本框。谢谢！我终于弄明白了，用1美元，2美元，3美元的组合就做到了。非常感谢。

<h1>Regular Expressions - Kevin Taylor</h1>

<form>

    <label for="socialNum" id="ssn">Enter Social Security Number:

    <input type="text" name="Social" id="socialNum" class="Social" maxlength="9"/>

    </label>

   <p><input type="submit" value="Submit">&nbsp;&nbsp;<input type="reset"></p>

</form>

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;
}