在jQuery中重複代碼

我是JS和jQuery的新手，我不喜歡一遍又一遍地重寫代碼或函數。這裏是我的代碼：在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函數和模糊事件。

來源

2016-03-19 Ordani Sanchez

我可以支持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,}$/);};

來源

2016-03-19 19:30:06 cars10m

是的，我也是這麼想的，我發現了一個驗證器jquery bootstrap，但作爲即時新的js，我想這對我來說更好，通過我自己編碼來學習 –

我相信避免額外代碼的最佳方法是重用已經創建和測試一段時間的內容。看看jQuery驗證插件，它提供了很多默認的驗證方法，並可自行定製 - http://jqueryvalidation.org/

來源

2016-03-19 19:22:22 ikryvorotenko

您可以考慮使用Jquery驗證插件進行表單驗證。至於你的代碼的話，你可以做一些這樣的事..

var validarN= function(){ 
     $("#username").blur(function(){ 
      var regex= /^[\w]{4,12}$/; 
      processRequest(this,regex); 
    }); 
    }; 

    function processRequest(ctrl, regex){ 
      var valor= $(ctrl).val(); 
      var formGroup = $(ctrl).closest(".form-group"); 
      if (valor.match(regex)) { 
       $(formGroup).removeClass("has-error"); 
       $(formGroup).addClass("has-success"); 
      } else { 
       $(formGroup).addClass("has-error"); 
      }; 
    }

來源

2016-03-19 19:28:16 ssilas777

到底在哪兒有重複的代碼，創建一個名爲函數接受參數。然後調用傳遞數據的函數。沿線的東西：

function validateField(field, regex) { 
    if (field.match(regex)) { 
     $(field).closest(".form-group").removeClass("has-error");; 
     $(field).closest(".form-group").addClass("has-success"); 
    } else { 
     $(field).closest(".form-group").addClass("has-error"); 
    }; 
} 

var validarN = function(){ 
    var valor= $(this).val(); 
    var regex= /^[\w]{4,12}$/; 
    validateField(field, regex); 
});

};

來源

2016-03-19 19:32:21 margo

在jQuery中重複代碼

回答

相關問題