Lineas textarea

luisgzafra · #1 (**permalink**) 23/02/2012, 12:08

Buenas, necesito obtener con javascript el número de lineas que tiene un textarea. ¿Cómo podría hacerlo?

Saludos!

zeudio · #2 (**permalink**) 23/02/2012, 12:25

se me ocurre algo asi:

Código:

<html>
<head>
<title>Página de ejemplo</title>

<script language="javascript">
function contar(){
	var aLineas = document.getElementById("tarea").value.split('\n');
	alert("El textarea tiene " + aLineas.length + " líneas");
}

</script>
</head>
<body>

<textarea id="tarea" cols="200" rows="4"></textarea>
<input type="button" value="contar lineas textarea" onclick="javascript: contar();" />

</body></html>

recoges los valores de la cadena dividida (dividiendo en sub-cadenas donde encuentre saltos de linea) y los pones en un array. Ya solo resta contar los items de dicho array

saludos

Panino5001 · #3 (**permalink**) 23/02/2012, 14:07

Otra opción (porque a veces la aparición de un renglón puede deberse al flujo normal del texto en relación al ancho del contenedor y no sólo a los saltos de línea), sería calcular el alto total del área scrolleable sobre el alto de línea:

Código PHP:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Documento sin título</title>
<style>
textarea{ width:80px; height:50px; line-height:15px; font-size:12px;}
</style>
<script type="text/javascript">
function getCSS(o,prop){
    if(window.getComputedStyle){
        return document.defaultView.getComputedStyle(o,null).getPropertyValue(prop); 
    }else{ 
        var re = /(-([a-z]){1})/g; 
        if (prop == 'float') prop = 'styleFloat'; 
        if (re.test(prop)) { 
            prop = prop.replace(re, function () { 
                return arguments[2].toUpperCase(); 
            }); 
        } 
        return o.currentStyle[prop] ? o.currentStyle[prop] : null; 
    } 
}  
onload=function(){
    var c=document.getElementById('area');
    var cuantos=c.scrollHeight/parseInt(getCSS(c,'line-height'));
    alert(cuantos);
}
</script>

</head>

<body>
<form action="" method="get"><textarea id="area" name="" cols="">Hah
Hahye hahye aye hahye
Om maam na pum imjya
Kothbiro
Ke luru do ketaa-lha
Om maam pum imjya
Kothbiro
Ke luru do ketaa-lha
Hah
Hahye hahye aye hahye
Om maam pum imjya
Kothbiro
Ke luru do ketaa-lha
Om maam na pum imjya
Kothbiro
Ke luru do ketaa-lha
ah
Hahye hahye hahye
Hah
Hahye hahye hahye
Yah yebi tom nuguee
Um kuru tili bare made
Kothbiro
Kem luru do ketaa-lha</textarea></form>
</body>
</html>