2016-04-04 4 views
0

私はフィードバックをユーザーに提供するフォームフィールドを用意しています。たとえば、iMinLength以上の長さが必要です。JS入力された文字に基づいてフィールドの検証のロジックを取得して削除する方法

ユーザーの入力の冒頭では、おそらく入力中であるため、エラーメッセージを表示したくありません。

長さの検証メッセージは、必要な6文字を入力して長さが6文字未満になるように削除した場合にのみ表示できますか?

ここに私が持っているロジックのモックアップがあります。上記の部分を除いて、必要なものすべてを行います。

上記のように動作するように調整するにはどうすればよいですか?私は基本的ユーザーは最初の6つの以上の文字を入力したとき(例えばinputが発射された)この部分は入力時に実行したい場合、ここでは6未満

$('#sNewPasswordResult').html('<span style="color:red;">Password must be at least 6 characters</span>');

に行ってきましたが、これまでフル塊です:

$(document).on('input blur', '#sSignUpPassword', function (e) { 

if ($('#sSignUpPassword').val().length > iMinLength) { 

    $('#sNewPasswordResult').html("Password: <i class='fa fa-fw fa-check' style='color:#339933'>"); 
    $('#sSignUpPassword').css("border", "1px solid green"); 
} 
else {  
    if (e.type == 'focusout') { //only for leaving the form field 

     $('#sNewPasswordResult').html('<span style="color:red;">Password must be at least 6 characters</span>'); 
     $('#sSignUpPassword').css("border", "1px solid red"); 
    } 

}; 
}); 

答えて

1

私は、ユーザーが最小になるまで文字を削除した場合、私はこのように、エラーを表示し、ユーザーが最小の文字に達した場合に制御するためのフラグを作成することによって、あなたの問題を解決:

$("#passwd").keyup(function() { 
    var $passwd = $(this); 

    if ($passwd.val().length >= 6) { 
     $passwd.data("reach-typing", true); 
    } 
    }); 
    $("#passwd").blur(function() { 
    var $passwd = $(this); 

    if ($passwd.val().length < 6 && $passwd.data("reach-typing") === true) { 
     $("#errorLength").show(); 
    } else { 
     $("#errorLength").hide(); 
    } 
    }); 

プランカ:https://plnkr.co/edit/zt9HLg?p=preview

関連する問題