The
Palm
Civet

jquery live character counter

here is a handy little jquery script for doing a live character counter on form fields. in your markup, all you need to do is add class="countdown limit_{integer}_" to your inputs/textareas and put a <span class="remaining"></span> placeholder next to it. then, season it accordingly.


var countdown = {
	init: function() {
	countdown.remaining = countdown.max - $(countdown.obj).val().length;
	if (countdown.remaining > countdown.max) {
		$(countdown.obj)
			.val($(countdown.obj).val()
			.substring(0,countdown.max));
	}
		$(countdown.obj)
			.siblings(".remaining")
			.html(countdown.remaining + " characters remaining.");
	},
	max: null,
	remaining: null,
	obj: null
};
$(".countdown").each(function() {
	$(this).focus(function() {
		var c = $(this).attr("class");
		countdown.max = parseInt(c.match(/limit_[0-9]{1,}_/)[0]
			.match(/[0-9]{1,}/)[0]);
		countdown.obj = this;
		iCount = setInterval(countdown.init,1000);
	}).blur(function() {
		countdown.init();
		clearInterval(iCount);
	});
});

{via}

compiling and sharing code, ideas, and tools for making better websites and applications.

by justin talbott {email me}

what is a palm civet?