javascript - 在 jQuery 中重复代码

Question

我是 JS 和 jQuery 的新手，我不喜欢一遍又一遍地重写代码或函数。这是我的代码:

var validarN= function(){
    $("#username").blur(function(){
        var valor= $(this).val();
        var regex= /^[\w]{4,12}$/;
        if (valor.match(regex)) {
            $(this).closest(".form-group").removeClass("has-error");;
            $(this).closest(".form-group").addClass("has-success"); 
        } else {
            $(this).closest(".form-group").addClass("has-error");
        };


    });
};

var validarPw = function(){
    $("#pass").blur(function(){
        var varlor, regex
        valor= $(this).val()
        regex= /(?=\S*?[A-Z])(?=\S*?[a-z])(?=\S*?[0-9])\S{6,}$/;
        if (valor.match(regex)) {
            $(this).closest(".form-group").removeClass("has-error");
            $(this).closest(".form-group").addClass("has-success");
        } else {
            $(this).closest(".form-group").addClass("has-error");
        };
    });
};
var confirmarPw= function() {
    $("#passV").blur(function() {
        var valor= $(this).val();
        var valorP= $("#pass").val();
        regex= /(?=\S*?[A-Z])(?=\S*?[a-z])(?=\S*?[0-9])\S{6,}$/;
        if (valor.match(regex) && valor==valorP) {
            $(this).closest(".form-group").removeClass("has-error");
            $(this).closest(".form-group").addClass("has-success");
        } else {
            $(this).closest(".form-group").addClass("has-error");
        };
    });
}

我正在进行表单验证。如果可能的话，我也想要一个封装 jQuery 函数和模糊事件的表单。

Answer 1

我可以支持 ikryvorotenko 的说法，但如果你想继续你自己的功能，你可以这样做

var validate = function(sel,regex){
    $(sel).blur(function(){
        var varlor $(this).val()
        if (valor.match(regex)) {
            $(this).closest(".form-group").removeClass("has-error");
            $(this).closest(".form-group").addClass("has-success");
        } else {
            $(this).closest(".form-group").addClass("has-error");
        };
    });
};

然后

var validarN=function(){validate("#username",/^[\w]{4,12}$/);},
    validarPw=function(){validate("#pass",/(?=\S*?[A-Z])(?=\S*?[a-z])(?=\S*?[0-9])\S{6,}$/);},
    confirmarPw=function(){validate("#passV",/(?=\S*?[A-Z])(?=\S*?[a-z])(?=\S*?[0-9])\S{6,}$/);};