jQuery плагин ограничения количества вводимых символов в textarea
Пример как ограничить количество вводимых символов в TEXTAREA, т.е. используя JavaScript (и библиотеку jQuery) эмитировать действие атрибута maxlength.
Нам понадобится использовать библиотеку jQuery. Как обычно:
<script src="путь/к/jquery.js" type="text/javascript"></script>
Код плагина с небольшими комментариями:
<script type="text/javascript"> // создаём плагин maxlength jQuery.fn.maxlength = function(options) { // определяем параметры по умолчанию и прописываем указанные при обращении var settings = jQuery.extend({ maxChars: 10, // максимальное колличество символов leftChars: "character left" // текст в конце строки информера }, options); // выполняем плагин для каждого объекта return this.each(function() { // определяем объект var me = $(this); // определяем динамическую переменную колличества оставшихся для ввода символов var l = settings.maxChars; // определяем события на которые нужно реагировать me.bind('keydown keypress keyup',function(e) { // если строка больше maxChars урезаем её if(me.val().length>settings.maxChars) me.val(me.val().substr(0,settings.maxChars)); // определяем колличество оставшихся для ввода сиволов l = settings.maxChars - me.val().length; // отображаем значение в информере me.next('div').html(l + ' ' + settings.leftChars); }); // вставка информера после объекта me.after('<div class="maxlen">' + settings.maxChars + ' ' + settings.leftChars + '</div>'); }); }; </script>
Как вы видите, код получился небольшим и в чем-то даже понятным. Лучше всего его поместить в отдельный файл, скажем maxlength.js. Осталось лишь инициировать действие плагина для TEXTAREA. Как таковой, это можно сделать по ID, классу или тегу. Я предпочитаю ID, как наиболее определённый. Выглядеть это может следующим образом:
<script type="text/javascript"> $(document).ready(function(){ $("#textarea").maxlength(); }); </script> <textarea id='textarea' style='width:100%; height:200px'></textarea>
Здесь просто дожидаемся загрузки документа и инициализируем наш плагим. Стоит также отметить, что вы можете прописать свои параметры для maxlength(). Сделать это можно, к примеру, следующим образом:
$('#textarea).maxlength({ maxChars: 160 });
Взято с Курилка.co.ua дабы потом не искать. Спасибо им большое.