Маска для телефона

Важно! Скрипт работает корректно, если выбран тип поля формы "Телефон".

Результат установки будет на опубликованной странице.

1. Маска с автоматическим выбором страны

Код необходимо добавить в настройках страницы (раздел “Метрика и скрипты” - “Добавить плагин - Произвольный код - поле “BODY"):

<link rel="stylesheet" href="https://neremaitea.github.io/intltelplp/intlTelInput.css">  
<script src="https://neremaitea.github.io/intltelplp/intlnew.js"></script>  
<script>  
var ai=$("div[data-type=phone] input, div[plp-field=phone] input, div[cr-field=phone] input");  
ai.closest('.widget-field').css('z-index', '50');ai.attr("type", "tel");  
ai.each(function() {  
$(this).css('border')==''&&$(this).closest('.input').prev().css('padding-left','44px');  
});  
var defstr = "ru" // страна по умолчанию, если не удалось ее определить  
$.ajax({url: '//ipinfo.io',method: 'get',  
dataType: 'json',success: function(r){str=r.country.toLowerCase()},  
error: function() {str=defstr},  
complete:function () {  
$(ai).intlTelInput({  
defaultCountry: str})}});  
</script>

2. Маска формата +7 (999) 999-9999:

Код необходимо добавить в настройках страницы (раздел “Метрика и скрипты” - “Добавить плагин - Произвольный код - поле “BODY"):

<script type="text/javascript" src="https://cdn.jsdelivr.net/gh/digitalBush/jquery.maskedinput@master/dist/jquery.maskedinput.min.js"></script>  
<script type="text/javascript">  
var phoneInput = $("div[data-type=phone] input, div[plp-field=phone] input, div[cr-field=phone] input");  
$(phoneInput).mask("+7 (999) 999-9999");  
$(phoneInput).each(function() {  
if ($(this).attr('value') ) $(this).attr('placeholder',$(this).attr('value'))})  
$(phoneInput).change(function() {  
if ($(this).val()=='') $(this).closest('phoneInput').removeClass('is-filled'); else  
$(this).closest('phoneInput').addClass('is-filled')});  
</script>

Важно! Результат будет на опубликованной странице. В редакторе маска отображаться не будет.

3. Маска формата +99999999999?9:

Маска телефона, в которой можно указать 11 или 12 цифр. Она подойдёт и для номеров Украины, и для РФ.

Код необходимо добавить в настройках страницы (раздел “Метрика и скрипты” - “Добавить плагин - Произвольный код - поле “BODY"):

<script type="text/javascript" src="https://cdn.jsdelivr.net/gh/digitalBush/jquery.maskedinput@master/dist/jquery.maskedinput.min.js"></script>  
<script type="text/javascript">  
var phoneInput = $("div[data-type=phone] input, div[plp-field=phone] input, div[cr-field=phone] input");  
$(phoneInput).mask("+99999999999?9");  
$(phoneInput).each(function() {  
if ($(this).attr('value') ) $(this).attr('placeholder',$(this).attr('value'))})  
$(phoneInput).change(function() {  
if ($(this).val()=='') $(this).closest(phoneInput).removeClass('is-filled'); else  
$(this).closest(phoneInput).addClass('is-filled')});  
</script>

Важно! Результат будет на опубликованной странице. В редакторе маска отображаться не будет.