jQuery: regolare dinamicamente l'altezza di un elemento textarea in base al testo presente

Possiamo regolare l'altezza di un elemento textarea con jQuery.

Il seguente plugin regola l'altezza dell'elemento textarea in base alle righe di testo presenti:


(function( $ ) {
	$.fn.autogrow = function() {
		return this.each(function() {
			var textarea = this;
			$.fn.autogrow.resize( textarea );
			$( textarea ).focus(function() {
				textarea.interval = setInterval(function() {
					$.fn.autogrow.resize( textarea );
				}, 500);
			}).blur(function() {
				clearInterval( textarea.interval );
			});
		});
	};
	$.fn.autogrow.resize = function( textarea ) {
		var lineHeight = parseInt( $( textarea ).css( "line-height"), 10 );
		var lines = textarea.value.split( "\n" );
		var columns = textarea.cols;
		var lineCount = 0;
		$.each( lines, function() {
			lineCount += Math.ceil( this.length / columns ) || 1;
		});
		var height = lineHeight * ( lineCount + 1 );
		$( textarea ).css( "height", height );
	};
})( jQuery );

Torna su