Без рубрики

Виртуальная клавиатура для ввода цифр

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

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

Такая клавиатура может пригодиться для защиты от спама (когда нужно ввести какие-то данные, для подтверждения того, что вы не спам-робот) или просто оригинально украсить вашу форму.

Пример такой клавиатуры вы можете увидеть, нажав на картинку ниже:

Шаг 1.

Скачаем

Прикреплённые файлы:
Файл: scripts.zip
Размер: [43 Kb] (забрали: 13 раз)

и подключим необходимые для работы скрипты (скрипт jQuery, плагин keypad и таблицу стилей CSS).

<link href=»style.css» rel=»stylesheet» type=»text/css»>

        <script type=»text/javascript» src=»jquery1.3.1.js»></script>

        <script type=»text/javascript» src=»jquerykeypad.js»></script>

Шаг 2.

Между тегами вставим следующий код:

<script type=»text/javascript»>

        $(function () {

$(‘#defaultKeypad’).keypad();

});

</script>

Шаг 3.

В том месте, где мы хотим видеть поле с текстовой клавиатурой, вставим следующий код:

<input type=»text» id=»defaultKeypad»>

То есть простому текстовому полю мы добавили идентификатор «defaultKeypad», который указали в шаге 2.

Готово! Попробуйте установить эту клавиатуру и на свой сайт!