ФорумРазработкаКлиентская сторонаЮзабилити интерфейсов → Подскажите хороший плагин для масок номеров телефонов в веб-формах

Подскажите хороший плагин для масок номеров телефонов в веб-формах

  • adw0rd

    Сообщения: 22902 Репутация: N Группа: в ухо

    Spritz 19 июня 2015 г. 7:21

    Лучше на vanila.js, на худой конец на jquery

    adw/0
  • phpdude

    Сообщения: 26617 Репутация: N Группа: в ухо

    Spritz 19 июня 2015 г. 7:27, спустя 5 минут 2 секунды

    найдешь - дай ссылку. Тоже интересует ЛУЧШИЙ. Остальных дохуя :)

    Сапожник без сапог
  • adw0rd

    Сообщения: 22902 Репутация: N Группа: в ухо

    Spritz 19 июня 2015 г. 7:29, спустя 2 минуты 57 секунд

    Надо скорее сделать раздел на пыхе по сравнению, я бы вот сейчас заполнил его

    adw/0
  • Sinkler

    Сообщения: 9658 Репутация: N Группа: в ухо

    Spritz 19 июня 2015 г. 10:38, спустя 3 часа 8 минут 57 секунд

    последний раз использовал это, в принципе, никто не придирался digitalbush » Masked Input Plugin [digitalbush.com]

  • adw0rd

    Сообщения: 22902 Репутация: N Группа: в ухо

    Spritz 24 июня 2015 г. 2:50, спустя 4 дня 16 часов 11 минут

    JavaScript · Jasny Bootstrap [jasny.github.io] тут ещё есть, сделаю таблицы на пыхе и добавлю все эти либы туда

    Спустя 60 сек.

    digitalbush » Masked Input Plugin [digitalbush.com] вот еще

    adw/0
  • phpdude

    Сообщения: 26617 Репутация: N Группа: в ухо

    Spritz 24 июня 2015 г. 2:58, спустя 8 минут 3 секунды

    давай делай уже а то одни разговоры

    Сапожник без сапог
  • adw0rd

    Сообщения: 22902 Репутация: N Группа: в ухо

    Spritz 24 июня 2015 г. 3:02, спустя 4 минуты 10 секунд

    ))))

    adw/0
  • Ivan.

    Сообщения: 494 Репутация: N Группа: Адекваты

    Spritz 26 июня 2015 г. 12:42, спустя 2 дня 9 часов 40 минут

    если ангуляр (а у меня во всех проектах ангуляр) - то ui-mask + placeholder
    А так написать нехуй делать.

    Вот, написал WvdwKG [codepen.io]

    Спустя 104 сек.

    ссылку на код то не дал WvdwKG [codepen.io]

    Спустя 47 сек.

    
    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
        .special {
            font-family: sans-serif;
            padding: 5px;
            border: solid 1px lightgray;
        }
    
        .phone-input {
            z-index: 1;
            background-color: transparent;
        }
    
        .phone-input:valid {
            color: darkgreen;
        }
    
        .phone-input:invalid {
            color: darkred;
        }
        </style>
    </head>
    <body>
    
    <input type="tel" class="phone-input special" required>
    
    <script type="text/javascript">
        var phoneInputs = document.getElementsByClassName('phone-input');
    
        for (var i = phoneInputs.length - 1; i >= 0; i--) {
            phoneInputs[i].pattern = '[\\+]7[\\040][\\(]\\d{3}[\\)][\\040]\\d{3}[\-]\\d{2}[\\-]\\d{2}';
            phoneInputs[i].placeholder = '+7 (___) ___-__-__';
    
            phoneInputs[i].onkeyup = phoneInputs[i].onfocus = function (e) {
                var realChar, requiredChar, newValue;
                if (e.keyCode && e.keyCode == 8 && e.target.value.length > 0) {
                    e.target.value = '';
                }
    
                e.target.value = e.target.value
                    .replace(/[^\+0-9\- \(\)]/g, '')
                    .substring(0, e.target.placeholder.length);
    
                for (var j = 0; j &lt; e.target.placeholder.length; j++) {
                    realChar = e.target.value[j] || '_';
                    requiredChar = e.target.placeholder[j];
                    newValue = e.target.value.split();
    
                    if (requiredChar !== '_') {
                        if (realChar !== requiredChar) {
                            newValue[j] = requiredChar;
                            e.target.value = newValue.join('');
                        }
                    } else {
                        if (!/[0-9]/.test(realChar)) {
                            e.target.value = newValue.join('');
                            break;
                        }
                    }
                }
    
                e.target.parentElement.firstChild.value =
                    e.target.value + 
                    e.target.parentElement.firstChild.placeholder.substring(
                        e.target.value.length, 
                        e.target.parentElement.firstChild.placeholder.length
                    );
            };
    
            var fakeInput = document.createElement('input');
            fakeInput.disabled = 'disabled';
            fakeInput.value = phoneInputs[i].placeholder;
            fakeInput.placeholder = phoneInputs[i].placeholder;
    
            for (var c = 0; c &lt; phoneInputs[i].classList.length; c++) {
                if (phoneInputs[i].classList[c] !== 'phone-input') {
                    fakeInput.classList.add(phoneInputs[i].classList[c]);
                }
            }
    
            fakeInput.style.color = 'lightgray';
            fakeInput.style.backgroundColor = 'transparent';
            fakeInput.style.position = 'absolute';
            fakeInput.style.zIndex = '-1';
    
            var relativeBlock = document.createElement('div');
            relativeBlock.style.position = 'relative';
            relativeBlock.style.display = 'block';
            relativeBlock.style.margin = '0';
            relativeBlock.style.padding = '0'
            relativeBlock.appendChild(fakeInput);
            document.body.insertBefore(relativeBlock, phoneInputs[i]);
            relativeBlock.appendChild(phoneInputs[i]);
        }
    </script>
    </body>
    </html>
    

    Спустя 134 сек.

    че то говно какое-то получилось, не смотрите

  • phpdude

    Сообщения: 26617 Репутация: N Группа: в ухо

    Spritz 26 июня 2015 г. 12:51, спустя 8 минут 44 секунды

    че то говно какое-то получилось, не смотрите

    @Ivan., тож так подумал, просто не стал писать, лень

    Спустя 9 сек.

    бля ты еще и пыху сломал! :(

    Сапожник без сапог
  • Sinkler

    Сообщения: 9658 Репутация: N Группа: в ухо

    Spritz 26 июня 2015 г. 12:53, спустя 1 минуту 44 секунды

    было уже, я ломал так)

  • phpdude

    Сообщения: 26617 Репутация: N Группа: в ухо

    Spritz 26 июня 2015 г. 13:03, спустя 10 минут 14 секунд

    экранирование пизда. кому руки оборвать? :)

    Сапожник без сапог
  • md5

    Сообщения: 11951 Репутация: N Группа: в ухо

    Spritz 26 июня 2015 г. 13:20, спустя 17 минут 15 секунд

    ну ясно

    профи объебались опять

    ТОЖЕ МНЕ ДЖАНГО НАХОЙ

    все умрут, а я изумруд
  • kostyl

    Сообщения: 5201 Репутация: N Группа: Джедаи

    Spritz 26 июня 2015 г. 13:23, спустя 2 минуты 20 секунд

    Бугага

  • phpdude

    Сообщения: 26617 Репутация: N Группа: в ухо

    Spritz 26 июня 2015 г. 13:28, спустя 5 минут 21 секунду

    зоебало убрал скобочку

    Спустя 22 сек.

    
    ЗБС ага? <script>
    <
    </script>
    

    Спустя 4 сек.

    jkj

    Сапожник без сапог
  • kostyl

    Сообщения: 5201 Репутация: N Группа: Джедаи

    Spritz 26 июня 2015 г. 14:56, спустя 1 час 27 минут 35 секунд

    asdf

Пожалуйста, авторизуйтесь, чтобы написать комментарий!