• Вопрос без рабочей ссылки на проблему считается риторическим. Без ссылки и скриншота - провокацией!

Решено Как сделать маску ввода телефонного номера?

Image CMS

Boulingist81

Форумчанин
#1
Доброго дня, уважаемые специалисты!
Прошу вашего совета:
В woocommerce, на странице оформления заказа, в пункте ввода телефонного номера, хочу реализовать маску вида: +7(___)-__-__-___ (по умолчанию), что бы ни какие другие знаки кроме цифр не вводились.
Но проблема в том, что я не могу понять, какой файл редактировать и что писать.
Нашел разные плагины, но ума не приложу как прописывать их правильно.
Пробовал этот http://digitalbush.com/projects/masked-input-plugin ни чего не сработало :(
(хотя скорее всего руки кривые )
Может ли кто то рассказать "На пальцах" как установить?
Не посчитайте за наглость.... Не смог сам разобраться.
 

Boulingist81

Форумчанин
#3
В файле header перед </head> Прописал
Код:
<script type="text/javascript" src="zerif-lite/js/jquery-1.7.2.min.js" ></script>
<script type="text/javascript" src="zerif-lite/js/jquery.maskedinput-1.3.min.js"></script>
<script>
$("#billing_phone").mask("(999) 99-99-999");


$("#billing_phone").on("blur", function() {
    var last = $(this).val().substr( $(this).val().indexOf("-") + 1 );
    
    if( last.length == 3 ) {
        var move = $(this).val().substr( $(this).val().indexOf("-") - 1, 1 );
        var lastfour = move + last;
        
        var first = $(this).val().substr( 0, 9 );
        
        $(this).val( first + '-' + lastfour );
    }
});
</script>
 

searchingman

Гуру
Местный
#4
В functions.php вставить код
PHP:
// WC 2.6.4: Добавить маску ввода на базе http://digitalbush.com/projects/masked-input-plugin
add_action('wp_enqueue_scripts', 'my_maskedinput');
function my_maskedinput() {
    // подгружаем скрипты только на страницы оформления заказа
    if (is_checkout()) {
        // загружаем скрипт, который находиться в ПапкаТемы\assets\js\jquery.maskedinput.min.js
        wp_enqueue_script('maskedinput', get_template_directory_uri() . '/assets/js/jquery.maskedinput.min.js', array('jquery'));
        add_action( 'wp_footer', 'masked_script', 999);
    }
}
 function masked_script() {
    if ( wp_script_is( 'jquery', 'done' ) ) {
?>
    <script type="text/javascript">
        jQuery( function( $ ) {
            $("#billing_phone").mask("(999) 99-99-999");
        });
    </script>
<?php
    }
}
На примере темы Storefront результат. (см. скриншот).