Форматирование номера международного телефонного ввода?

Насколько я понимаю, они удалили опцию автоформатирования в последней версии библиотеки International Telephone Input. Эта опция форматировала номер в соответствии со страной, выбранной пользователем. Но в соответствии с формами я все еще могу использовать util.js и функцию числового формата для достижения этих параметров (https://github.com/jackocnr/intl-tel-input/wiki/utils.js) Я пробовал несколько раз, но не смог применить этот параметр. Например, для номера США, как мне отформатировать номер в следующем формате: (201) -255-6655. Это мой код ниже. На мой взгляд, это лучшая библиотека js для международных номеров.

$( document ).ready(function() {

    $('#contactForm')
    .find('[name="phoneNumber"]')
        .intlTelInput({
            utilsScript:"https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/12.1.5/js/utils.js",
          
            autoPlaceholder: true,
            initialCountry:"us",
            geoIpLookup:"auto",

        });


    });
<!DOCTYPE html>
<html>
<head>
<title>Phone</title>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/12.1.5/css/intlTelInput.css">
<link rel="stylesheet" href="./intlmask.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/12.1.5/js/intlTelInput.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/12.1.5/js/utils.js"></script>

<script src="./intlmask.js"></script>
</head>
<body>

  <form id="contactForm" class="form-horizontal">
    <div class="form-group">
        <label class="col-xs-3 control-label">Phone number</label>
        <div class="col-xs-5">
            <input type="tel" class="form-control" name="phoneNumber" />
        </div>
    </div>
</form>

</body>
</html>

как это  введите описание изображения здесь


person jsPlayer    schedule 06.12.2017    source источник
comment
Кажется, ваш фрагмент мне подходит. Что с этим не работает?   -  person Obsidian Age    schedule 06.12.2017
comment
@ObsidianAge, эй, я добавил картинку к вопросу, я хочу отформатировать номер, когда пользователь размывает ввод   -  person jsPlayer    schedule 06.12.2017
comment
@jsPlayer, где вы должны загрузить эти два файла ./intlmask.js и ./intlmask.css   -  person Nath Shivanand    schedule 17.10.2020


Ответы (2)


поэтому я в основном добавил функцию и запускал ее, когда пользователь ориентировался на ввод. utils.js уже предоставляет нам форматирование (intlTelInputUtils.formatNumber). нам просто нужно передать ему номер и код страны / инициалы. проверьте мой код ниже

    function test(){
        var number =  $('input[name="phoneNumber"]').val();
        var classf = $(".selected-flag > div").attr("class");
        var flag = classf.slice(-2);
  
        console.log("check number: ", number);
        console.log("check classf: ", classf);
        console.log("check flag: ", flag);
        
        var formattedNumber = intlTelInputUtils.formatNumber(number, flag, intlTelInputUtils.numberFormat.INTERNATIONAL);
        $('input[name="phoneNumber"]').val(formattedNumber);

}

person jsPlayer    schedule 06.12.2017
comment
ваш пример больше не работает - person Fernando Torres; 29.04.2021

person    schedule
comment
И как заставить его работать со всеми форматами стран? - person Fernando Torres; 29.04.2021