Module «validation.js». Валидация формы jquery-validation. Проверка номера телефона

Демо:

https://codepen.io/ildar-meyker/pen/bGjdZRV

Подключение:

<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.1/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.5/dist/jquery.validate.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jquery-validation@1.19.5/dist/localization/messages_ru.js"></script>

Разметка:

<form action="#" class="form-feedback" id="form-feedback" novalidate>
    <div class="form-feedback__title">Форма обратной связи</div>

    <div class="form-feedback__body">
        <div class="form-feedback__input">
            <div class="input">
                <input type="text" placeholder="ФИО*">
            </div>
        </div>
        <div class="form-feedback__input">
            <div class="input">
                <input type="email" placeholder="Email*" required>
            </div>
        </div>
        <div class="form-feedback__input">
            <div class="input">
                <input type="text" placeholder="Телефон" class="js-phone">
            </div>
        </div>
        <div class="form-feedback__area">
            <div class="input">
                <textarea rows="5" placeholder="Задайте вопрос*"></textarea>
            </div>
        </div>
    </div>

    <div class="form-feedback__ctrl">
        <button class="btn-filled" type="submit">Отправить</button>
    </div>

</form>

Стили:

label.error {
    display: block;
    font-size: 1.4rem;
    margin-top: .5em;
    color: #f00;
}

Инициализация:

// базовый пример
$("#form-feedback").validate({
    lang: "ru",
});


// расширение для mobileRU
$.validator.addMethod(
    "mobileRU",
    function (phone_number, element) {
        var ruPhone_number = phone_number.replace(/\(|\)|\s+|-/g, "");
        return (
            this.optional(element) ||
            (ruPhone_number.length > 9 &&
                /^((\+7|7|8)+([0-9]){10})$/.test(ruPhone_number))
        );
    },
    "Пожалуйста укажите корректный номер."
);

// пример c rules
$("#form-help").validate({
    lang: "ru",
    rules: {
        email: {
            required: true,
            email: true,
        },
        phone: {
            required: true,
            mobileRU: true,
        },
    },
});