javascript - 如何编写字段验证循环

Question

我想弄清楚为什么验证总是失败？正则表达式应该没问题，我想问题应该出在 if(loginreg.test(login) && passwordreg.test(password) && repassword==password) 中。有人可以帮我吗？

function CheckAuthData() {  
    var loginreg = /^(?=.*[A-Z])(?=.*\d)[A-Za-z\d]{4,}\d$/g;
    var login = document.getElementById("login").value; 
    var passwordreg = 
        /^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{1,}$/g;
    var password = document.getElementById("password").value;
    var repassword = document.getElementById("repassword").value;    

    if(loginreg.test(login) && passwordreg.test(password) && repassword==password){         
        document.getElementById("labellogin").innerHTML = "";   
        document.getElementById("labelpassword").innerHTML = "";    
        document.getElementById("labelrepassword").innerHTML = "";      
        document.getElementById("pers_data").style.display = "block";       
    }

    if(!loginreg.test(login)){
        var label = document.getElementById("labellogin").innerHTML = "Login error!";
        document.getElementById("labellogin").style.color = "red";
    }   

    if(!passwordreg.test(password)){
        document.getElementById("labelpassword").innerHTML = "Password error!";
        document.getElementById("labelpassword").style.color = "red";
    }   

    if(repassword!=password){
        document.getElementById("labelrepassword").innerHTML =
            "Should be the same password!";
        document.getElementById("labelrepassword").style.color = "red";
    }
}

Answer 1

我能看到的唯一实际错误是，如果这些条件中的任何一个失败一次，您永远不会清除元素上的红色事情发生的地方。但由于您清除了元素中的文本，因此这可能并不重要。

也就是说，两次测试相同的条件(在第一个 if 中，然后在后续的条件中再次测试，相反)是一个即将发生的维护问题，函数中的所有重复代码也是如此.

您也不需要在每次调用函数时重新创建正则表达式，也不需要在它们上使用 g 标志。

这解决了上述各种问题(注意:我假设这包含在某种作用域函数中，因此我们不会通过移出这些正则表达式来创建新的全局变量):

var loginreg = /^(?=.*[A-Z])(?=.*\d)[A-Za-z\d]{4,}\d$/;
var passwordreg = 
        /^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{1,}$/;
function CheckAuthData() {  
    var login = document.getElementById("login").value; 
    var password = document.getElementById("password").value;
    var repassword = document.getElementById("repassword").value;    
    var failed = false;

    updateField("labellogin", loginreg.test(login), "Login error!");
    updateField("labelpassword", passwordreg.test(password), "Password error!");
    updateField("labelrepassword", repassword == password, "Should be the same password!");

    if(!failed) {
        document.getElementById("pers_data").style.display = "block";       
    }

    function updateField(id, valid, message) {
        var element = document.getElementById(id);
        element.innerHTML = valid ? "" : message;
        element.style.color = valid ? "" : "red";
        failed = failed || !valid;
    }
}

<小时/>

将其设为 CW 因为……嗯……它可能实际上并没有回答问题，因为问题中没有足够的信息。但希望它能有所帮助。