jQuery textareaMaxlength plugin
A jQuery plugin that implements the 'maxlength' property for textarea fields and validates in JSLint at the strictest settings.
Requires jQuery 1.6 or later.
HTML
<textarea id="ta1" maxlength="5" cols="10" rows="5"></textarea>
maxlength="5"<br>
<textarea id="ta2" maxlength="10" cols="10" rows="5"></textarea>
maxlength="10"<br>
<textarea id="ta3" maxlength="" cols="10" rows="5"></textarea>
maxlength=""<br>
<textarea id="ta4" maxlength="a" cols="10" rows="5"></textarea>
maxlength="a"<br>
<textarea id="ta5" type="textarea" cols="10" rows="5"></textarea>
No maxlength<br>
JavaScript
/*global $, jQuery, document*/
(function ($) {
'use strict';
$.textareaMaxlength = function () {
// Allows the 'maxlength' attribute to be used with textarea fields to limit the
// number of characters that can be entered.
// e.g <textarea id="myfield" maxlength="250"></textarea>
// jsFiddle: http://jsfiddle.net/davidwaterston/DdxCQ
$(document).on('keyup input paste', 'textarea[maxlength]', function () {
var maxlength = parseInt($(this).attr('maxlength'), 10),
text = $(this).val(),
textlength = text.length;
if (textlength > maxlength) {
$(this).val(text.substr(0, maxlength));
}
});
};
}(jQuery));
$(document).ready(function () {
'use strict';
$.textareaMaxlength();
});