http://lab.berkerpeksag.com/jGrow
What is jGrow?
jGrow is a jQuery plug-in that makes the textarea adjust its size according to the length of the text.
It works smoothly with jQuery 1.2.x. It was tested on IE6/7, Firefox 2.0.x and Opera 9.x, and no bug was spotted yet.
非常好一个jQuery插件, 但原版不支持 Ctrl + V 的键盘操作事件, 直接代码.
/* 原版代码.
* jGrow 0.2
* 08.02.2008
* 0.2 release: 04.03.2008
*/
(function($) {
$.fn.jGrow = function(options) {
var opts = $.extend({}, $.fn.jGrow.defaults, options);
return this.each(function() {
$(this).css({ overflow: "hidden" }).bind("keypress", function() {
$this = $(this);
var o = $.meta ? $.extend({}, opts, $this.data()) : opts;
if(o.rows == 0 && (this.scrollHeight > this.clientHeight)) {
this.rows += 1;
} else if((this.rows <= o.rows) && (this.scrollHeight > this.clientHeight)) {
this.rows += 1;
} else if(o.rows != 0 && this.rows > o.rows) {
$this.css({ overflow: "auto" });
}
$this.html();
});
});
}
$.fn.jGrow.defaults = { rows: 0 };
})(jQuery);
以下为改进后的代码, 支持 Ctrl+V 键盘事件操作
/*
* jGrow 0.2
* 08.02.2008
* 0.2 release: 04.03.2008
*/
// Updated by S.Sams 2008-07-24 21:47 以兼容Ctrl+V的操作
(function($) {
$.fn.jGrow = function(options) {
var opts = $.extend({}, $.fn.jGrow.defaults, options);
return this.each(function() {
var isCtrl = false;
$(this).css({ overflow: "hidden" }).bind("keypress", function() {
$this = $(this);
var o = $.meta ? $.extend({}, opts, $this.data()) : opts;
if(o.rows == 0 && (this.scrollHeight > this.clientHeight)) {
this.rows += 1;
} else if((this.rows <= o.rows) && (this.scrollHeight > this.clientHeight)) {
this.rows += 1;
} else if(o.rows != 0 && this.rows > o.rows) {
$this.css({ overflow: "auto" });
}
$this.html();
}).bind("keydown",function(event){
if(event.keyCode == 17) isCtrl = true;
}).bind("keyup",function(event){
if(isCtrl && event.keyCode == 86)
{
var o = $.meta ? $.extend({}, opts, $this.data()) : opts;
var getCL = this.value.split('\n').length
if( getCL <= o.rows)
{
this.rows = getCL;
}
else
{
this.rows = o.rows;
$(this).css({ overflow: "auto" });
}
isCtrl = false;
}
});
});
}
$.fn.jGrow.defaults = { rows: 0 };
})(jQuery);
// 自适应 textarea 有内容存在的高度自动调整
/*
* jGrow 0.2
* 08.02.2008
* 0.2 release: 04.03.2008
*/
// Updated by S.Sams 2008-07-24 21:47 以兼容Ctrl+V的操作
(function($) {
$.fn.jGrow = function(options) {
var opts = $.extend({}, $.fn.jGrow.defaults, options);
return this.each(function() {
var isCtrl = false;
$(this).css({ overflow: "hidden" }).bind("keypress", function() {
$this = $(this);
var o = $.meta ? $.extend({}, opts, $this.data()) : opts;
if(o.rows == 0 && (this.scrollHeight > this.clientHeight)) {
this.rows += 1;
} else if((this.rows <= o.rows) && (this.scrollHeight > this.clientHeight)) {
this.rows += 1;
} else if(o.rows != 0 && this.rows > o.rows) {
$this.css({ overflow: "auto" });
}
$this.html();
}).bind("keydown",function(event){
if(event.keyCode == 17) isCtrl = true;
}).bind("keyup",function(event){
if(isCtrl && event.keyCode == 86)
{
var o = $.meta ? $.extend({}, opts, $this.data()) : opts;
var getCL = this.value.split('\n').length
if( getCL <= o.rows)
{
if(getCL > parseInt(this.rows))
this.rows = getCL;
}
else
{
this.rows = o.rows;
$(this).css({ overflow: "auto" });
}
isCtrl = false;
}
});
// Updated by S.Sams 2008-07-25
// 修正 testarea 有内容存在的情况下的自动调整高度
if($(this).val().length > 0)
{
var o = $.meta ? $.extend({}, opts, $(this).data()) : opts;
var getCL = this.value.split('\n').length
if( getCL <= o.rows)
{
if(getCL > parseInt(this.rows))
this.rows = getCL;
}
else
{
this.rows = o.rows;
$(this).css({ overflow: "auto" });
}
}
});
}
$.fn.jGrow.defaults = { rows: 0 };
})(jQuery);