表单验证onblur()不起作用

Form validation onblur() doesn't work

本文关键字:不起作用 onblur 验证 表单      更新时间:2023-09-26

我有这个javascript代码(函数SHA-1位于外部文件中):

    window.onload = validatePass;
    function validatePass() {
        var el = document.getElementById("oriPass");
        var user_pass = el.value;
        var hashed_pass = SHA1(user_pass);
        var span = document.createElement("span");
        el.parentNode.appendChild(span); 
        el.onblur = function doSomething() {
            if(user_pass == null || user_pass == "") {
                span.setAttribute('class','required');
                span.innerHTML="this is a required field";
            }
            else {
                if(hashed_pass != '7c4a8d09ca3762af61e59520943dc26494f8941b') {
                    span.setAttribute('class','required');
                    span.innerHTML="wrong password";
                }
                else {
                    span.setAttribute('class','required_ok');
                        span.innerHTML="valid password";    
                    }
                }
        }
    }

和html:

    <form name="form" method="post" action="change_pass.php">
    <div class="row">
        <div class="col1">write your password:<span class="required">&#42;</span></div>
        <div class="col2">
            <input type="password" name="original_pass" id="oriPass" />
        </div>
    </div>
    </form>

由于某种原因,每次我测试它,我得到相同的输出:"valid password",无论字段是空的,有效的还是无效的。

我在这里做错了什么?

var user_pass...var hashed_pass...代码移动到onblur函数中。现在只分配onload并且永远不会更改。此外,使用onchange而不是onblur可能会更好。

window.onload = validatePass;
function validatePass() {
    var el = document.getElementById("oriPass");

    var span = document.createElement("span");
    el.parentNode.appendChild(span); 
    el.onchange = function doSomething() {
        var user_pass = el.value;
        var hashed_pass = SHA1(user_pass);
        if(user_pass == null || user_pass == "") {
            span.setAttribute('class','required');
            span.innerHTML="this is a required field";
        }
        else {
            if(hashed_pass != '7c4a8d09ca3762af61e59520943dc26494f8941b') {
                span.setAttribute('class','required');
                span.innerHTML="wrong password";
            }
            else {
                span.setAttribute('class','required_ok');
                    span.innerHTML="valid password";    
                }
            }
    }
}

仅在加载时设置密码变量。从那以后就再也没有改变过。您需要在onblur函数中设置它