Ограничение символов вводимых в текстовое поле на JavaScript


Сегодня мы напишем функцию на JavaScript. Это функция будет проверять строку, введенную в текстовое поле на ограничение максимальной длины.


Открываем тег <script> и в нем пишем, функцию, внутри которой мы получаем значение текстового поля, id которого равен id1. Далее при каждом нажатии какой-то кнопки на клавиатуре с помощью функции keyup будет запускаться функция count, которая используя функцию length, считает количество символов в нашем текстом поле и записывает его в переменную umber.


Затем вы проверяем, если значение number больше чем 250, то мы заменяем значение текстового поля, на сообщение "Ограничение по символам". Иначе блоку c id равным count мы выставляем значение равное переменной number. Изначально внутри блока лежит значение 0.

 

Листинг JavaScript функции:

$(function() {
    $("input[id='id1']").keyup(function count() {
        number = $("input[id='id1']").val().length;
        if (number > 250) $("input[id='id1']").val('Ограничение по символам');
        else $("#count").html(+number);
    });
});  

 

Пример текстового поля и блока:

<input id="id1" type="text" name="title" value="Введите заголовок"/>
<div id="count" style="position: relative; float: right; margin-top: -5px; width: 30px; color:#21bc11; text-align: right;">0</div>


Наглядно это выглядит вот так:

Здесь может быть ваша реклама! Блок 1. Настройка рекламы в личном кабинете.
Grai Просмотров сегодня +2 30 июня 2017 команда сайта
Ещё пока нет комментариев, будь первым!
Оставить комментарий
Здесь может быть ваша реклама! Блок 2. Настройка рекламы в личном кабинете.
   🔔 Отдохните не много, может Вам будет интересно прочитать статьи пользователей нашего сайта.

Как на AJAX передать переменные в PHP с выводом результата в блок с проверкой условий без перезагрузки страницы

Тег applet - это апплет

Как сделать модуль бесплатной консультации на ajax

Тег area - это область ссылки

Решил и я написать статью о том, как покупал сайт на бирже ТЕЛДЕРИ

Основные запросы SQL работа с базой данных PHP

Как разрезать изображение на части и склеить обратно из фрагментов, используя PHP и Ajax

Работа с БД на MVC создание модели и выполнение SQL запросов. Часть Вторая

Как на MVC с помощью PHP правильно загружать файлы с сервера. Часть Вторая

Недостатки раскрутки групп Вконтакте специальными сервисами

Безопасная авторизация пользователей на MVC и PHP

Тег article - это статья
Здесь может быть ваша реклама! Блок 3. Настройка рекламы в личном кабинете.

→ Магазин матрасов в Москве с доставкой по России.
→ Недорогие детские матрасы от 2215 руб!
Реклама Интернет-магазин Каталог матрасов открыт 24 часа, 7 дней в неделю!
www.catalog-matrasov.ru
→ Продажа арендованных лесных участков в РБ от 30 000 руб. Жми сейчас!
РекламаПокупая участок вы получаете выгоду, вам не нужно бегать по инстанциям и заниматься бумажной волокитой, тратя свое время. Вы сразу приобретаете ГОТОВЫЙ БИЗНЕС – лесозаготовительное предприятие.
www.svetobor.com
→ BULLET-SHOP - сварка аргоном, полуавтомат, тюнинг авто!
Реклама Ремонтируем радиаторы, интеркулеры, пайпинг и ВСЁ из алюминия, чугуна, стали с ГАРАНТИЕЙ КАЧЕСТВА. Диагностика и ремонт подвески, трансмиссии, всех узлов и агрегатов
www.bullet-shop.pro
→ Доставка товаров из Китая в кротчайшие сроки без переплат!
Реклама Вам нужен товар из Китая мы с радостью доставим его, а также поможем с выкупом товара с ТаоБао, АлиБаба, 1688.com. Помощь в переводе при заключении сделок!
www.unikorob.ru
Реклама помогает поддерживать
и развивать наш сервис.


Подробнее
(ссылка откроется в новой вкладке)