Add Textarea Row for Every Line Break
jQuery
By
William Thomas
|
Friday, February 10, 2012
Hide Comments
Code:
<html>
<head>
<script src=
"http://wcetdesigns.com/assets/javascript/jquery.js"
></script>
<script>
$
(
function
()
{
$
(
'#t'
)
.keyup
(
function
()
{
var
v
=
$
(this)
.val
()
;
//STRING INSIDE TEXTAREA
var
r
=
1
;
//TEXTAREA ROWS (MUST MATCH THE INTERNAL CSS VALUE)
for
(i
=
0
; i
<
v.length; i
++
){
//CHECKS FOR LINE BREAKS, WHICH WOULD CALL FOR EXTENSIONS
var
vs
=
v.
substr
(
i,
1
)
;
if
(vs
=="\n"
){
//'\n' IS THE LINE BREAK PATTERN
r
++
;
//ADDS ONE ROW FOR EVERY LINE BREAK
}
}
$
(this)
.attr
(
"rows"
, r
)
;
//CSS PROPERTIES ALTERED FOR EVERY LINE BREAK
}
)
;
}
)
;
</script>
<style>
#t {
font-size
:
12px
;
overflow
:
hidden
;
!important
/*MAY STILL HAVE A SCROLL DUE TO FONT-SIZE*/
resize
:
none
;
}
</style>
</head>
<body>
<textarea id=
"t"
cols=
"20"
rows=
"1"
></textarea>
</body>
</html>
