html代码定义文本框：
javascript代码：
<SCRIPT type=text/javascript>
$('textarea#resize').autoResize({
// 文本框改变大小时触发事件，这里改变了文本框透明度
onResize : function() {
$(this).css({opacity:0.8});
},
// 动画效果回调触发事件，这里改变了文本框透明度
animateCallback : function() {
$(this).css({opacity:1});
},
// 动画效果持续时间（ms），默认150
animateDuration : 300,
// 每次改变大小时，扩展（缩小）的高度（像素），默认20
extraSpace : 40,
//当文本框高度大于多少时，不再扩展，出现滚动条，默认1000
limit: 200
});
</script>
或者最简单：
<SCRIPT type=text/javascript>
$('textarea#resize').autoResize();
</script>
例子：
引用js:
/*
* jQuery autoResize (textarea auto-resizer)
* @copyright James Padolsey http://james.padolsey.com
* @version 1.04
*/
(function ($) {
$.fn.autoResize = function (options) {
// Just some abstracted details,
// to make plugin users happy:
var settings = $.extend({
onResize: function () {},
animate: true,
animateDuration: 150,
animateCallback: function () {},
extraSpace: 20,
limit: 1000
},
options);
// Only textarea's auto-resize:
this.filter('textarea').each(function () {
// Get rid of scrollbars and disable WebKit resizing:
var textarea = $(this).css({
resize: 'none',
'overflow-y': 'hidden'
}),
// Cache original height, for use later:
origHeight = textarea.height(),
// Need clone of textarea, hidden off screen:
clone = (function () {
// Properties which may effect space taken up by chracters:
var props = ['height', 'width', 'lineHeight', 'textDecoration', 'letterSpacing'],
propOb = {};
// Create object of styles to apply:
$.each(props, function (i, prop) {
propOb[prop] = textarea.css(prop);
});
// Clone the actual textarea removing unique properties
// and insert before original textarea:
return textarea.clone().removeAttr('id').removeAttr('name').css({
position: 'absolute',
top: 0,
left: -9999
}).css(propOb).attr('tabIndex', '-1').insertBefore(textarea);
})(),
lastScrollTop = null,
updateSize = function () {
// Prepare the clone:
clone.height(0).val($(this).val()).scrollTop(10000);
// Find the height of text:
var scrollTop = Math.max(clone.scrollTop(), origHeight) + settings.extraSpace,
toChange = $(this).add(clone);
// Don't do anything if scrollTip hasen't changed:
if (lastScrollTop === scrollTop) {
return;
}
lastScrollTop = scrollTop;
// Check for limit:
if (scrollTop >= settings.limit) {
$(this).css('overflow-y', '');
return;
}
// Fire off callback:
settings.onResize.call(this);
// Either animate or directly apply height:
settings.animate && textarea.css('display') === 'block' ? toChange.stop().animate({
height: scrollTop
},
settings.animateDuration, settings.animateCallback) : toChange.height(scrollTop);
};
// Bind namespaced handlers to appropriate events:
textarea.unbind('.dynSiz').bind('keyup.dynSiz', updateSize).bind('keydown.dynSiz', updateSize).bind('change.dynSiz', updateSize);
});
// Chain:
return this;
};
})(jQuery);
官方：http://james.padolsey.com/javascript/jquery-plugin-autoresize/