Advanced Search

Twitter like Character Counter

/ Published in: jQuery
Save to your folder(s)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. (function($) {
  2.  
  3. 	$.fn.CharacterCounter = function(options) {
  4.  
  5. 		var defaults = {
  6.  
  7. 			allowed        : 140,
  8. 			counterText    : "Characters left: ",
  9. 			overlimitClass : "overlimit_txt",
  10. 			pID            : "#character_count",
  11. 			txtColor       : "#ff0000"
  12.  
  13. 		}; 
  14.  
  15. 		var options = $.extend(defaults, options); 
  16.  
  17. 		function calculate(obj) {
  18. 			var count = $(obj).val().length;
  19. 			var available = options.allowed - count;
  20. 			if (available == 0) {
  21. 				$(options.pID).addClass(options.overlimitClass);
  22. 			} else if (available > 0) {
  23. 				$(options.pID).removeClass(options.overlimitClass);
  24. 			}
  25. 			$(options.pID).html(options.counterText + available);
  26. 		}
  27.  
  28. 		calculate(this);
  29.  
  30. 		$(this).keyup(function() { calculate(this) });
  31. 		$(this).change(function(){ calculate(this) });
  32.  
  33. 	};
  34.  
  35. })(jQuery);

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.