Блог

Я работаю над небольшим проектом с использованием jQuery и провожу проверку формы, я хотел бы знать, есть ли какое-либо решение, позволяющее избежать повторителей в моем коде, говоря о (addClass и removeClass)

мой код :

 if (value.string.match(regex)) {
   $('#'   index).removeClass('is-invalid')
   $('#'   index).addClass('is-valid')
} else {
   $('#'   index).removeClass('is-valid')
   $('#'   index).addClass('is-invalid')
}
 

Вместо того, чтобы иметь как is-invalid класс, так и is-valid класс, измените свой CSS, чтобы иметь только один класс, который переключается при изменении проверки. Например, вместо

 .some-input.is-valid {
  // rules
}
.some-input.is-invalid {
  // more rules
}
 

использовать

 .some-input {
  // rules
}
.some-input.invalid {
  // more rules WHICH OVERRIDE the original rules if needed
}
 

Тогда все, что вам нужно, это:

 const match = Boolean(value.string.match(regex));
$('#'   index).toggleClass('invalid', match);
 

Точно так же, как и с classList.toggle помощью, вы можете передать второй аргумент в jQuery toggleClass , чтобы указать, должен ли класс существовать или нет.