Сокращение идентичного jQuery кода

259

17 июня 2018, 14:30

Постепенно изучаю jQuery и учусь писать если не идеально правильный, то хотя бы похожий на него код. Есть несколько почти идентичных форм на сайте и под каждую написан свой jQuery код(меняются поля, их обработка и sendmail.php). По сути это одно и тоже с разным названием и хотел бы узнать как можно сократить.

Пример с проверкой имени и телефона, который используется в каждой форме:

var nameval   = $("#name").val();
var namevalid = validateName(nameval);
var phoneval   = $("#phone").val();
var phonevalid = validatePhone(phoneval);
if(namevalid == false) {
    $(".field-name").addClass("error");
}
else if(namevalid == true){
    $(".field-name").removeClass("error");
}
if(phonevalid == false) {
    $(".field-phone").addClass("error");
}
else if(phonevalid == true){
    $(".field-phone").removeClass("error");
}

Так же, чтобы проверка работала, в каждой секции с формой есть код:

function validateName(name) {
    var reg =  /^[а-яё\s]+$/iu;
    return reg.test(name);
}
function validatePhone(phone) {
    var reg =  /[0-9,\s]/i;
    return reg.test(phone);
}

Что, как мне кажется, тоже есть не совсем правильно и это должно быть глобально.

Возможно есть какие-либо документации или статьи на эту тему? Чтобы это не было просто CTRL+C/V.

Answer 1

не в качестве ответа, а поскольку в коммент кода толком не добавишь.

сравнивать булевые выражения с true/false
зачем повторять if в ветке else
почему вместо всего этого просто не использовать toggleClass
почему бы не обернуть всю повторяющуюся логику в функцию?

условно:

var conf = [
         { field: "name", check: nameValid },
         { field: "phone", check: phoneValid },
      ];
conf.forEach(function(cfg){
       var $f =  $(".field-" + cfg.field);
       var valid = cfg.check( $f.val() );
       $f.toggleClass('has-error', valid);
}) ;