JQuery重构代码帮助

时间:2016-03-20 19:29:36

标签: javascript jquery refactoring

我正在学习编码,我有一些代码在3个不同的文件中重复了3次。

如何重构以下代码,以便从公共源调用代码,传递对于三个文件不同的元素的id。

我尝试了很多方法,但我不断得到错误。除了输入id之外,以下代码在所有三个文件中都是相同的:'id_new_password1`,每个

不同

如何重构以下代码,以便我可以传入元素id并拥有相同的代码体:

这是代码的第1部分:

$("input#id_new_password1").on("focus keyup", function () {
    var a = $(this).val();
    $("#password_change_recommendation_wrap").fadeIn(400);
    // minimum of 12 characters in password length.
    if (a.length >= 12) {
        $("#password_length").removeClass("password_not_recommended").addClass("password_recommended");
    } else {
        $("#password_length").removeClass("password_recommended").addClass("password_not_recommended");
    }

    // minimum of 1 digit in password.
    if (a.match(/\d/)) {
        $("#password_digit").removeClass("password_not_recommended").addClass("password_recommended");
    } else {
        $("#password_digit").removeClass("password_recommended").addClass("password_not_recommended");
    }

    // minimum of 1 uppercase character in password.
    if (a.match(/[A-Z]/)) {
        $("#password_upper_case").removeClass("password_not_recommended").addClass("password_recommended");
    } else {
        $("#password_upper_case").removeClass("password_recommended").addClass("password_not_recommended");
    }

    // minimum of 1 lowercase character in password.
    if (a.match(/[a-z]/)) {
        $("#password_lower_case").removeClass("password_not_recommended").addClass("password_recommended");
    } else {
        $("#password_lower_case").removeClass("password_recommended").addClass("password_not_recommended");
    }

    // minimum of 1 special character in password.
    if ( a.match(/.[!,@,#,$,%,^,&,*,?,_,~,-,(,)]/) ) {
        $("#password_special_character").removeClass("password_not_recommended").addClass("password_recommended");
    } else {
        $("#password_special_character").removeClass("password_recommended").addClass("password_not_recommended");
    }
});

这是代码的第二部分:

    $("input#id_password1").on("focus keyup", function () {
        var a = $(this).val();
        $("#password_registration_recommendation_wrap").fadeIn(400);
        // minimum of 12 characters in password length.
        if (a.length >= 12) {
            $("#password_length").removeClass("password_not_recommended").addClass("password_recommended");
        } else {
            $("#password_length").removeClass("password_recommended").addClass("password_not_recommended");
        }

        // minimum of 1 digit in password.
        if (a.match(/\d/)) {
            $("#password_digit").removeClass("password_not_recommended").addClass("password_recommended");
        } else {
            $("#password_digit").removeClass("password_recommended").addClass("password_not_recommended");
        }

        // minimum of 1 uppercase character in password.
        if (a.match(/[A-Z]/)) {
            $("#password_upper_case").removeClass("password_not_recommended").addClass("password_recommended");
        } else {
            $("#password_upper_case").removeClass("password_recommended").addClass("password_not_recommended");
        }

        // minimum of 1 lowercase character in password.
        if (a.match(/[a-z]/)) {
            $("#password_lower_case").removeClass("password_not_recommended").addClass("password_recommended");
        } else {
            $("#password_lower_case").removeClass("password_recommended").addClass("password_not_recommended");
        }

        // minimum of 1 special character in password.
        if ( a.match(/.[!,@,#,$,%,^,&,*,?,_,~,-,(,)]/) ) {
            $("#password_special_character").removeClass("password_not_recommended").addClass("password_recommended");
        } else {
            $("#password_special_character").removeClass("password_recommended").addClass("password_not_recommended");
        }

    });

这是我的html模板代码:

<div id="row_id_new_password1" class="form-group  ">
    <label for="id_new_password1" class="control-label  required  control-label-01">
        New password:
    </label>
    <div class="controls ">
        <input id="id_new_password1" name="new_password1" type="password" class="kmw-disabled keymanweb-font" data-parsley-required="true" data-parsley-required-message="This field is required." data-parsley-id="0678"><span class="parsley-errors-list" id="parsley-id-0678"></span><span class="spacer"></span><span rel="tooltip" html="true" class="no_decoration no_flicker_padding" tabindex="-1" title="" data-original-title="The longer the better. Include numbers and special characters for stronger security."><i class="fa fa-lightbulb-o blue_color icon_size18"></i></span>


    </div>
</div>

0 个答案:

没有答案