Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Show word or character count on text boxes/areas that have data-max-length="<number>" and data-max-type="(character|word)" attributes.
<script type="text/javascript">
$(function(){
function wordCount(str, charlist) {
var len = str.length, cl = charlist && charlist.length,
chr = '', tmpStr = '', i = 0, c = '', wC = 0, reg = '', match = false;
var _preg_quote = function(str) {
return (str + '').replace(/([\\\.\+\*\?\[\^\]\$\(\)\{\}\=\!<>\|\:])/g, '\\$1');
}
var _getWholeChar = function(str, i) {
var code = str.charCodeAt(i);
if (code < 0xD800 || code > 0xDFFF) {
return str.charAt(i);
}
if (0xD800 <= code && code <= 0xDBFF) {
if (str.length <= (i + 1)) {
throw 'High surrogate without following low surrogate';
}
var next = str.charCodeAt(i + 1);
if (0xDC00 > next || next > 0xDFFF) {
throw 'High surrogate without following low surrogate';
}
return str.charAt(i) + str.charAt(i + 1);
}
if (i === 0) {
throw 'Low surrogate without preceding high surrogate';
}
var prev = str.charCodeAt(i - 1);
if (0xD800 > prev || prev > 0xDBFF) {
throw 'Low surrogate without preceding high surrogate';
}
return false;
}
if (cl) {
reg = '^(' + _preg_quote(_getWholeChar(charlist, 0))
for (i = 1; i < cl; i++) {
if ((chr = _getWholeChar(charlist, i)) === false) {
continue;
}
reg += '|' + _preg_quote(chr);
}
reg += ')$';
reg = new RegExp(reg);
}
for (i = 0; i < len; i++) {
if ((c = _getWholeChar(str, i)) === false) {
continue;
}
match = (c.search(/^[A-Za-z]+$/g) !== -1)
|| (reg && c.search(reg) !== -1)
|| ((i !== 0 && i !== len - 1) && c === '-')
|| (i !== 0 && c === "'");
if (match) {
tmpStr = tmpStr + c;
}
if (i === len - 1 || !match && tmpStr !== '') {
tmpStr = '';
wC++;
}
}
return wC;
}
var debounce = function(func, wait, immediate) {
var timeout;
wait = wait || 250;
return function() {
var context = this, args = arguments;
var later = function() {
timeout = null;
if (!immediate) {
func.apply(context, args);
}
};
var callNow = immediate && !timeout;
clearTimeout(timeout);
timeout = setTimeout(later, wait);
if (callNow) {
func.apply(context, args);
}
};
};
$(document).on('keyup', '#theform textarea[data-max-length]', debounce(
function(event){
var input = event.target;
var length = 0;
if ($(input).data('maxType') == 'character') {
length = parseInt($(input).val().length);
} else {
length = wordCount($(input).val());
}
var span = $(input).next('i.suffix').find('span');
span.text(length + ' out of ' + $(input).data('maxLength') + ' used');
if (length > parseInt($(input).data('maxLength'))) {
span.addClass('overload');
} else {
span.removeClass('overload');
}
}, 150
));
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.