mrKorg
@mrKorg
web developer

Как сделать интернациональную маску для input[type='tel']?

Нужно сделать интернациональную маску для ввода телефона.
Есть решения на jquery. Но нужно на чистом js или vue.js (последний - это вообще идеальный вариант).
Пытаюсь использовать https://github.com/MitrophD/vue-phone-input не получается завести.
Есть рабочие альтернативы данному компоненту?
  • Вопрос задан
  • 678 просмотров
Решения вопроса 1
Пригласить эксперта
Ответы на вопрос 2
  • Exploding
    @Exploding
    wtf?
    А "интернациональная" маска это какая? Каким требованиям она должна отвечать и что именно под "маской" подразумевается?
    ----------------------------
    Ну и в принципе не дожидаясь ответа, т.к. он все равно никак не повлияет на дальнейший текст:
    Как выше сказал Philipp - не ограничивайте ввод ибо маска хороша когда известна наверняка, а поди знай какая она у той страны/региона/города которого нет в той мега-библиотеке форматов телефонов, которую вы найдете и подключите чтобы правильный inputMask задать.
    Я бы наверно сделал так:

    Взял бы флаг, в смысле спрайт и css-ку к нему.

    Получил данные о посетителе, типа такого (на клиенте!):
    var request = new XMLHttpRequest();
    request.open('GET', 'http://api.sypexgeo.net/json', true);
    
    request.onload = function() {
      if (request.status == 200) {
        var data = JSON.parse(request.responseText),
    		telCode = "+"+data.country.phone;
    		console.log(telCode); // +380 например
      } else {
    		//тут сами выкручивайтесь:)))
      }
    };
    request.send();


    Флаг есть, код есть, еще в придачу хлама всякого, на ваше усмотрение, ну и сам инпут:
    <input type="tel" placeholder="+380____________" required pattern="+[0-9()-.^+\/*%^]">

    Где "+380" - код что из json добыли
    Такой проверки должно хватить и вроде норм еще и на вид (если сверстаете ровно)))))
    Проверять то все равно потом будете уже нормально, это так, для безруких хитрецов))
    Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через TM ID
Похожие вопросы
Вакансии с Моего Круга Все вакансии
Заказы с Фрилансим Все заказы