textarea и maxlength (JavaScript)

Всем верстальщикам известно, что поле для ввода <textarea> не понимает атрибута maxlength — ограничения на максимальное количество вводимых символов.

Проблема решается при помощи Джаваскрипта.

textarea_maxlength()

Напишем простую джаваскрипт-функцию, которая заставит тег <textarea> воспринимать атрибут maxlength.

Назовем функцию void textarea_maxlength(). Пример работы функции: /files/191/index.html

/** * Запускаем функцию после загрузки страницы, * можно через <body onLoad="textarea_maxlength()"> * * После запуска все поля <textarea> станут понимать атрибут maxLength * Например: <textarea maxlength="1000"></textarea>, максимум 1000 символов * можно ввести * */ function textarea_maxlength() { var i, maxLength, textArea; textArea = document.getElementsByTagName('textarea'); for (i = 0; i < textArea.length; i++) { maxLength = parseInt(textArea[i].getAttribute('maxlength')); if (maxLength > 0) { textArea[i].onchange = textArea[i].onkeyup = textArea[i].onkeydown = textArea[i].onkeypress = function(maxlength) { return function() { if (this.value.length > maxlength) { this.value = this.value.substring(0, maxlength); } } }(maxLength); } } }

Применение

После загрузки страницы запускаем функцию textarea_maxlength(), после чего все теги <textarea> начнут понимать атрибут maxlength.

Заключение

Решение грубое, но надежное. Конечно при вводе лишних символов функция просто обрезает лишнее с правого края и дело сделано, стандартное поле <input type="text" maxlength="50"> ведет себя по-другому, но усовершенствовать функцию до идеала дело техники.

Категории

ПрограммированиеJavaScriptСобытия

Комментарии