1

How do I validate a password field on entry and when empty (including spaces entered)?

JS

$(document).ready(function() 

{
$("#login_btn").click(function(){
    if($("#pass").val() == "") {
        $("#error").show("slow");
    }
    else if($("#pass").val() != "") {
        $("#error").hide("slow");
    }
});

});

HTML

<div id="login">
    <div id="login_header"><h2>Sign in</h2></div>
    <div id="dept">Department
        <select>
            <option value="CO" selected>CO</option>
        </select>
    </div>
    <div id="pass">Password
        <input type="password">
    </div>
    <div id="error">
        Required field cannot be blank
    </div>
    <div id="btn">
        <input type="button" value="Sign in" id="login_btn">
    </div>
</div>

http://jsfiddle.net/sfTHc/1/

4

3 に答える 3

1

$("#pass").val()はパスワード フィールドではなく#passであるため、意味がありません。div修正版:

$("#login_btn").click(function () {
    var pass = $.trim($("#pass input").val());
    if (!pass) {
        $("#error").show("slow");
    } else {
        $("#error").hide("slow");
    }
});

http://jsfiddle.net/sfTHc/3/

于 2013-03-07T20:29:08.077 に答える
0

$.trim を使用して、次のようにします。

$(document).ready(function() {
    $("#login_btn").click(function(){
        if($.trim($("#pass input").val()).length == 0) {
            $("#error").show("slow");
        } else {
            $("#error").hide("slow");
        }
    });

});

ライブデモ: http://jsfiddle.net/Soldier/C9es6/

于 2013-03-07T20:34:57.967 に答える
0

keypress イベントを使用し、検証関数で、検証する前にウィジェットから取得した値をトリミングします。

$(document).ready(function() {
    $("#login_btn").keypress(function(){
        var pass = $("#pass input").val();
        if($.trim(pass) == "") {
            $("#error").show("slow");
        }
        else  {
            $("#error").hide("slow");
        }
    });

});

編集：dfsqの回答で正しく指摘されているようにセレクターを修正しました。

于 2013-03-07T20:27:00.073 に答える