Максимальная длина для HTML <textarea>

StackOverflow https://stackoverflow.com/questions/43569

Вопрос

Как ограничить максимальное количество символов, которые могут быть введены в HTML <textarea>?Я ищу кроссбраузерное решение.

Это было полезно?

Решение

Тот Самый TEXTAREA тег не имеет MAXLENGTH приписывайте способ, которым INPUT тег работает, по крайней мере, не в большинстве стандартных браузеров.Очень простой и эффективный способ ограничить количество символов, которые могут быть напечатанный в TEXTAREA тег - это:

<textarea onKeyPress="return ( this.value.length < 50 );"></textarea>

Примечание: onKeyPress, будет препятствовать любому нажатию кнопки, любая кнопка включая клавиша обратного пробела.

Это работает, потому что логическое выражение сравнивает длину поля перед добавлением нового символа с максимальной длиной, которую вы хотите (50 в этом примере, используйте здесь свой собственный), и возвращает true, если есть место для еще одного символа, false если нет.Возврат false из большинства событий отменяет действие по умолчанию.Так, если текущая длина составляет уже 50 (или больше), обработчик возвращает false, в KeyPress действие отменено, и персонаж не добавлен.

Одной ложкой дегтя в бочке меда является возможность вставки в TEXTAREA, который не вызывает KeyPress событие для запуска в обход этой проверки.Internet Explorer 5+ содержит onPaste событие, обработчик которого может содержать проверку .Однако обратите внимание, что вы также должны учитывать, сколько символов ожидают в буфере обмена, чтобы узнать, превысит ли общее количество ваш лимит или нет.К счастью, IE также содержит буфер обмена объект из объекта window.1 Таким образом:

<textarea onKeyPress="return ( this.value.length < 50 );"
onPaste="return (( this.value.length +
window.clipboardData.getData('Text').length) < 50 );"></textarea>

Опять же, тот onPaste событие и clipboardData объектом являются только IE 5+.Для кроссбраузерного решения вам просто нужно будет использовать OnChange или OnBlur обработчик для проверки длины и обработки ее так, как вы хотите (автоматически усекайте значение, уведомляйте пользователя и т.д.).К сожалению, это не улавливает ошибку в том виде, в каком она происходит, только когда пользователь пытается покинуть поле, что не совсем удобно.

Источник

Кроме того, здесь есть другой способ, включающий готовый скрипт, который вы могли бы включить на свою страницу:

http://cf-bill.blogspot.com/2005/05/textarea-maxlength-revisited.html

Другие советы

HTML5 теперь позволяет maxlength атрибут на <textarea>.

Он поддерживается всеми браузерами, кроме IE <= 9 и iOS Safari 8.4.Видишь опорный стол на caniuse.com.

$(function(){  
  $("#id").keypress(function() {  
    var maxlen = 100;
if ($(this).val().length > maxlen) {  
  return false;
}  
})
});

Ссылка Установите максимальную длину в текстовой области Html

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top