3

専門家 私はここで少し助けが必要です. 私は3つの検証が行われるjspページを持っています:

  1. パスワードの強度 (ライブ チェックを使用、validate() 関数ではありません)
  2. パスワードの確認 (ライブ チェックではなく、validate() 関数を使用)
  3. 電子メール検証 (validate() 関数ではなくライブ チェックを使用)

ライブ チェックは、keyUp()関数と対応する jQuery によって行われます。

 $(document).ready(function(){

 $("#register-form").validate({
 rules: {
   password_again: {
      equalTo: "#password"
        }
                    }
 });


 $("#validate").keyup(function(){

        var email = $("#validate").val();

        if(email != 0)
        {
            if(isValidEmailAddress(email))
            {
                $("#validEmail").css({
                    "background-image": "url('validate/validYes.png')"
                });
            } else {
                $("#validEmail").css({
                    "background-image": "url('validate/validNo.png')"
                });
            }
        } else {
            $("#validEmail").css({
                "background-image": "none"
            });         
        }

    });

            $('#password').keyup(function(){
    $('#result').html(checkStrength($('#password').val()));
}); 

function checkStrength(password){

//initial strength
var strength = 0;

//if the password length is less than 6, return message.
if (password.length < 6) { 
    $('#result').removeClass();
    $('#result').addClass('short');
    return 'SHORT';
}

//length is ok, lets continue.

//if length is 8 characters or more, increase strength value
if (password.length > 7) strength += 1;

//if password contains both lower and uppercase characters, increase strength value
if (password.match(/([a-z].*[A-Z])|([A-Z].*[a-z])/))  strength += 1;

//if it has numbers and characters, increase strength value
if (password.match(/([a-zA-Z])/) && password.match(/([0-9])/))  strength += 1;

//if it has one special character, increase strength value
    if (password.match(/([!,%,&,@,#,$,^,*,?,_,~])/))  strength += 1;

//if it has two special characters, increase strength value
    if (password.match(/(.*[!,%,&,@,#,$,^,*,?,_,~].*[!,%,&,@,#,$,^,*,?,_,~])/)) strength += 1;

//now we have calculated strength value, we can return messages

//if value is less than 2
if (strength < 2 ) {
    $('#result').removeClass();
    $('#result').addClass('weak');
    return 'WEAK';  
} else if (strength == 2 ) {
    $('#result').removeClass();
    $('#result').addClass('good');
    return 'GOOD';
} else {
    $('#result').removeClass();
    $('#result').addClass('strong');
    return 'STRONG';
}
}


});

function isValidEmailAddress(emailAddress) {
    var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
    return pattern.test(emailAddress);
}

すべて正常に動作していますが、Confirm_Password 検証以外の [送信] ボタンを押した後に、これら 3 つの検証 (Confirm_Password、Password_Strength、E メール) のいずれかが失敗した場合、ページの転送を防ぐことはできません。Email & Password_Strength のアクションも制限したい。検証が失敗するたびに、そのフィールドにフォーカスを設定することを意味します。validate()この関数は Confirm_Password にのみ使用されることに注意してください。

4

2 に答える 2

0

あなたの質問が、jQuery自体でデータの処理がうまくいかないことを知っている/知っている場合に、jQueryでのデータ処理を防ぐ方法であると仮定すると、 $.ajax 関数を使用することをお勧めします。この機能を使用すると、すべてがうまくいった場合にのみリクエストを送信することを選択できます。例は次のとおりです。

$(document).ready(function(){
    // Here your controls about password strenght, email, etc...
    $('#FORM-ID').submit(function(){
        var url = "YOUR_ACTION";

        // YOUR CONTROLS
        if( isOK() ) {
            $.ajax({
                type: "POST",
                url: url,
                // You can use any other way to pass the data,
                //    my favorite is to serialize with jQuery function
                data: $("#FORM-ID").serialize(),
                success: function(data){
                     // Success Message
                } else {
                     alert(data);
                }
             });
             return false;
        } else {
             // Display Error message
        } 
    });
});

$.ajax の公式ドキュメントはこちらで、疑似サンプルはこちらでご覧いただけます。問題が発生した場合はお知らせください;）

次のようなコントロールの単純なブール関数を作成できます。

function isOk(parameters_to_check){
    if(all_conditions_are_true){
        return true;
    } else {
        return false;
    }
于 2013-04-21T16:41:57.983 に答える