Contact Form 7 и Cleave.js. Поле для ввода номера телефона

Спасибо, что обратили внимание на мой вопрос.

Я делаю для себя сайт на WordPress, параллельно обучаюсь программированию. Прошу вас помочь разобраться в одном моменте. Я реализовал контактную форму на базе плагина Contact Form 7. Подключил JS (cleave.js), чтобы сделать удобным ввод номера телефона (вводятся только цифры и в определенном количестве). Все прекрасно работает за исключением одного: поле для ввода номера телефон перестает работать, если одна и та же контактная форма была уже где-то запущена на сайте. Т.е. одна и та же контактная форма встречается на разных страницах сайта (например: на главной и внутренней странице). На главной странице поле для ввода номера работает корректно, а на внутренней странице условия для поля номера телефона не срабатывают.

Подскажите, пожалуйста, как исправить это, чтобы условия для поля ввода номера срабатывало не единично, при открытии сайта, а на всех страницах, где есть контактная форма. Автор советует использовать петлю, запустив instance.getRawValue(). Возможно, есть другое решение или JS, более простое в использовании.

Спасибо!

Ссылка на JS: https://github.com/nosir/cleave.js

Используемый код:

function enqueue_cleave(){
     wp_enqueue_script('cleave', get_stylesheet_directory_uri().'/js/cleave.min.js');
}
add_action('wp_enqueue_scripts', 'enqueue_cleave'); 

add_action('wp_footer', 'activate_cleave');

function activate_cleave(){
   if( is_page('') ){
?>

     <script type="text/javascript">
        document.addEventListener('DOMContentLoaded', () => {
        var phone = new Cleave('#phone', {
            numericOnly:true,
            prefix:'+',
            delimiter:'-',
            blocks:[5,4,4,2]
        });
    });

     </script>

<?php 
   }
}

Ответы (0 шт):