Question

我正在尝试使用javascript验证表单，这是我的代码

    <script type="text/javascript">
    function prevSubmit(){
        var oForm = document.forms[0];
        var pass1= oForm.elements["passwd"];
        var pass2=oForm.elements["repasswd"];
        var flag = 1;
        if (pass1.value.length>16) {
            document.getElementById("passError").innerHTML = "password may atleast 16 chars";
            flag = 0;
        }
        else
            document.getElementById("passError").innerHTML = "";

        if(pass1.value<=16 && pass1.value!=pass2.value)
        {
            document.getElementById("passError").innerHTML = "password must be same";
            flag = 0;
        }
        else
            document.getElementById("passError").innerHTML = "";
        return flag;
    }


</script>

这是我的表单元素，

        <form id="registration_form" action="registration.php" method="post" onsubmit="return prevSubmit();">
        <p>
            <label>Name</label>
            <input type="text" name="name"/>
            <span id="NameError"></span>
        </p>
        <p>
            <label>Email</label>
            <input type="text" name="email"/>
            <span id="emailError"></span>
        </p>
        <p>
            <label>Password</label>
            <input type="password" name="passwd"/>
            <span id="passError"></span>
        </p>
        <p>
            <label>Repeat Password</label>
            <input type="password" name="repasswd"/>
        </p>            
            <input type="submit" class="button" value="sign up"/>

        </form>

我想要完成的是检查密码，如果不匹配或大于16，则显示消息并阻止提交，但它不起作用，为什么？

Answer 1

使用true和false作为flag的值，而不是1和0。您必须返回false以阻止提交，其他任何内容都允许提交。

Answer 2

首先，此错误消息没有意义

password may atleast 16 chars

其次，您的第二次错误检查是错误的

if(pass1.value<=16 && pass1.value!=pass2.value)

您是说该值是否小于数字16且两个值不匹配。

为什么价值会低于16？检查应该是

if (pass1.value!=pass2.value)

与其他人建议的那样，使用true / false，而不是1和0作为truthy值。

Answer 3

我同意Barmar和epascarello的答案。

if条件应该以这种方式实现：

var oForm = document.forms[0];
var pass1= oForm.elements["passwd"];
var pass2=oForm.elements["repasswd"];
var ctrlError = document.getElementById("passError");

if (pass1.value.length < 16) {
    ctrlError.innerHTML = "Password must be at least 16 characters long.";
    return false;
}
else if (pass1.value != pass2.value) {
    ctrlError.innerHTML = "Passwords do not match.";
    return false;
}
else {
    ctrlError.innerHTML = "";
    return true;
}

Answer 4

来自javascript方法的"return false"

<input type="submit" class="button" value="sign up" onclick="javascript:return myFunc();"/>

function myFunc()
{
return false;
}

这是如何阻止提交表单的基本示例，如果我们返回false，则浏览器/ javascript引擎会阻止点击事件和提交的进一步传播。

如何使用javascript正确验证表单。？

4 个答案: