Question

对于我下面的代码，javascript验证了输入，但我无法阻止它提交。我怎么能阻止它。这是我的代码。

<html>

<head>
    <script>
        function validateForm() {
            [].forEach.call(document.querySelectorAll('input[name^=name]'), function (el, p, l) {
                if (el.name.indexOf('_var') > -1) {
                    if (el.value === "NA" && l[p - 1].value !== "NA") {
                        alert("Name_var must be filled out");
                        return false;
                    }
                    return true;
                }
            });
        }
    </script>
</head>

<body>
    <form name="myForm" action="demo_form.asp" onsubmit="return validateForm()" method="post">
        Name:
        <input type="text" name="name25"> Name1:
        <input type="text" name="name25_var">
        <input type="submit" value="Submit">
    </form>
</body>

</html>

Answer 1

试图保留你的代码，我会尝试声明一个变量来提交表单，只要不存在任何类型的错误，就像这样：

function validateForm() {
    var existError = false;

    [].forEach.call(document.querySelectorAll('input[name^=name]'), function (el, p, l) {
        if (el.name.indexOf('_var') > -1) {
            if (el.value === "NA" && l[p - 1].value !== "NA") {
                alert("Name_var must be filled out");
                existError = true;
                return false;
            }
            return true;
        }

        return existError;
    });
}

问题在于你的判决＆＃34;返回＆＃34;只是从＆＃34; forEach＆＃34;但是，forEach是一个永远不会停止直到循环所有元素的函数，如果你想在找到并错误的那一刻停止，那么你应该使用every：

function validateForm() {
        return [].every.call(document.querySelectorAll('input[name^=name]'), function(el, p, l) {
            if(el.name.indexOf('var') > 1 && el.value === "NA" && l[p - 1].value !== "NA") {
                alert('Name_var must be filled out');
                return false;
            }

            return true;
        });
    }

功能性示例：

＆＃13;

function validateForm() {
        return [].every.call(document.querySelectorAll('input[name^=name]'), function(el, p, l) {
            if(el.name.indexOf('var') > 1 && el.value === "NA" && l[p - 1].value !== "NA") {
                alert('Name_var must be filled out');
                return false;
            }

            return true;
        });
    }

＆＃13;

<form name="myForm" action="demo_form.asp" onsubmit="return validateForm()" method="post">
        Name:
        <input type="text" name="name25"> Name1:
        <input type="text" name="name25_var">
        <input type="submit" value="Submit">
    </form>

＆＃13;

表单验证失败，仍然在javascript中提交

1 个答案: