当我引入从函数调用传递的变量时，For 循环无法正常工作

For loop not working correctly when I introduce a variable passed from a function call

本文关键字：循环 For 常工作 工作 函数调用 变量      更新时间：2023-09-26

由于某种原因，我的验证函数工作得很好，直到我尝试传入从函数收到的变量。目前以下内容工作正常，但是当我取消下面的注释txtValue时，它不起作用。

function validate(formName) {
// create an object array to hold all html nodes
var formNodes = formName.getElementsByTagName("*");
var formNodesLength = formNodes.length;
// placeholder for error codes
var error = "";
// error style
var borderStyle = "3px solid #bbd531";
var txtValue = "";
// loop and find all nodes with the attribute "validate"
for (x=0; x<formNodesLength; x++) {
    if(formNodes[x].getAttribute("data-validation")){
        nodeValue = formNodes[x].value;
        nameValue = formNodes[x].getAttribute("name");
        validateValue = formNodes[x].getAttribute("data-validation");
        if (validateValue=="text" && (nodeValue==null || nodeValue=="")) { //if text match failed
        alert(nameValue);
            /*txtValue = findLabelValue();*/
            error += /*txtValue + */" is required<br />";
            formNodes[x].style.border=borderStyle;
        }
        else if (validateValue=="email" && !nodeValue.match(/'b[A-Z0-9._%+-]+@[A-Z0-9.-]+'.[A-Z]{2,4}'b/i)) { //if email match failed
            error += "email must be a valid address<br />";
            formNodes[x].style.border=borderStyle;
        }
        else if (validateValue=="phone" && !nodeValue.match(/'b[0-9]{3}-[0-9]{3}-[0-9]{4}'b/)) { //if phone match failed
            error += "phone must be a valid<br />";
            formNodes[x].style.border=borderStyle;
        }
        else if (validateValue=="website" && !nodeValue.match(/'b[a-zA-Z0-9'-'.]+'.[A-Z]{2,4}'b/i)) { //if website match failed
            error += "website must be a valid address<br />";
            formNodes[x].style.border=borderStyle;
        }
    }
}
if(error) {
    var formElement = "<div id='error-box'><strong>There was a problem with your submission</strong><br /></div>" + formName.innerHTML;
    formName.innerHTML = formElement;
    document.getElementById("error-box").innerHTML = error;
return false;
}
else {
    return true;
}

function findLabelValue() {
    var labelTagObj = formName.getElementsByTagName("label");
    var returnValue = "";
    for (x=0; x<labelTagObj.length; x++) {
        if (labelTagObj[x].getAttribute("for") == nameValue) {
            returnValue = labelTagObj[x].innerText;
            return returnValue;
        }
    }
} // End findLabelValue()

} // End validate(formName)

这是因为您在两个for循环中使用全局变量x作为计数器。

调用 findLabelValue() 函数时，它会将全局x设置为 0 ，并运行循环，这会干扰 validate() 函数中的主循环。

在这两个函数中使用var x以确保它不是全局的。

这是您正在做的事情，缩短以使其更清晰。

function validate(formName) {
    // ...
    // loop using the `x` variable as a counter
    for (x=0; x<formNodesLength; x++) {
        if(formNodes[x].getAttribute("data-validation")){
            // ...
            if (validateValue=="text" && (nodeValue==null || nodeValue=="")) {
                // Invoke the other function
                txtValue = findLabelValue();
            }
            // ...
        }
    }
    // ...
    function findLabelValue() {
        // ...
        // OOPS. you've altered the same `x` being used by the other loop
        for (x=0; x<labelTagObj.length; x++) {
            // ...
        }
    } 
}

在这两个函数中，x=0都应该var x=0。

相关文章：