<MyRusakov.ru />

Программирование на C++ с Нуля до Гуру

Программирование на C++ с Нуля до Гуру

Данный курс научит Вас программировать на языке C++, который, несмотря на свой почтенный возраст, необычайно сильно востребован. Курс состоит из 6 разделов, посмотрев которые и выполнив все упражнения, Вы с нуля освоите этот язык и сможете создавать самые разные проекты любой сложности на C++.

Для закрепления материала из уроков к ним идёт множество упражнений.

Дополнительно к курсу идёт вспомогательная система, которая не даст Вам забросить начатое на полпути.

Также вместе с курсов Вы получаете Бонус "Программирование на C++ в Unreal Engine", в котором Вы научитесь создавать игры на C++ с использованием этого движка.

Подробнее
Подписка

Подпишитесь на мой канал на YouTube, где я регулярно публикую новые видео.

YouTube Подписаться

Подписавшись по E-mail, Вы будете получать уведомления о новых статьях.

Подписка Подписаться

Добавляйтесь ко мне в друзья ВКонтакте! Отзывы о сайте и обо мне оставляйте в моей группе.

Мой аккаунт Мой аккаунт Моя группа
Опрос

Зачем Вы изучаете программирование/создание сайтов?

Маска ввода для цифр на чистом JavaScript

Маска ввода для цифр на чистом JavaScript

Доброго времени суток! В данном примере я покажу Вам как можно создать маску ввода для чисел на чистом JavaScript.


<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JS Input Mask</title>
</head>

<body>

    <input type="text" data-format="(***) ***-****" data-mask="(###) ###-####">

    <input type="text" data-format="**.**.****" data-mask="MM.DD.YYYY">

    <input type="text" data-format="+* (***) ***-**-**" data-mask="+* (***) ***-**-**" />


    <script>
        function doFormat(value, pattern, mask) 
        {
            // удаляем все нечисловые значения из значения
            const strippedValue = value.replace(/[^0-9]/g, "");

            // преобразуем строку-значение в массив символов
            const chars = strippedValue.split('');


            let count = 0;
            let formatted = '';

            // форматируем строку
            for (let i = 0; i < pattern.length; i++) 
            {
                const char = pattern[i];
                if (chars[count]) 
                {
                    if (/\*/.test(char)) {
                        formatted += chars[count];
                        count++;
                    } else {
                        formatted += char;
                    }
                } 
                else if (mask) 
                {
                    const splittedMask = mask.split('');

                    if (splittedMask[i])
                    {
                        formatted += splittedMask[i];
                    } 
                }
            }


            return formatted;
        }


        // проходимся по каждому элементу назначая на них обработчики
        // нажатия клавиш
        document.querySelectorAll('[data-mask]').forEach(function (e) {


            function format(elem) {
                const val = doFormat(elem.value, elem.getAttribute('data-format'));
                elem.value = doFormat(elem.value, elem.getAttribute('data-format'), elem.getAttribute('data-mask'));

                if (elem.createTextRange) {
                    var range = elem.createTextRange();
                    range.move('character', val.length);
                    range.select();
                } else if (elem.selectionStart) {
                    elem.focus();
                    elem.setSelectionRange(val.length, val.length);
                }
            }

            e.addEventListener('keyup', function () {
                format(e);
            });

            e.addEventListener('keydown', function () {
                format(e);
            });

            format(e)
        });
    </script>
</body>

</html>

Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http://myrusakov.ru)!

Добавляйтесь ко мне в друзья ВКонтакте: http://vk.com/myrusakov.
Если Вы хотите дать оценку мне и моей работе, то напишите её в моей группе: http://vk.com/rusakovmy.

Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления

Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.

Порекомендуйте эту статью друзьям:

Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):

  1. Кнопка:

    Она выглядит вот так: Как создать свой сайт

  2. Текстовая ссылка:

    Она выглядит вот так: Как создать свой сайт

  3. BB-код ссылки для форумов (например, можете поставить её в подписи):

Комментарии (0):

Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.