Capturar la posicion cuando hago click en un textarea

StrikeFreedom · #1 (**permalink**) 10/07/2009, 19:51

Hola, en un textarea tengo un texto un frase digamos, y cuando quisiera que cuando haga click en algun lugar de la frase me diga cuentos caracteres van escritos hasta esa posicion donde estaria el cursor, estoy tratando pero solo puedo capturar la longitud total del texto en un textarea con el length.

Pueden ayudarme?

duskrow · #2 (**permalink**) 10/07/2009, 20:06

Cita:

es una funcion que desarrolle hace rato , requieres jquery

StrikeFreedom · #3 (**permalink**) 10/07/2009, 20:22

umm, creo que esa funcion no es para lo que necesito, osea cuando haga click en el textarea, que cuente cuantos caracteres hay desde el inicio del textarea hasta donde esta el cursor donde hize click

DeveloperFresh · #4 (**permalink**) 10/07/2009, 21:56

Talvez esto te ayude!

Código HTML:

<html>
<head>
  <title></title>
<script>
function contar(ele){
if(typeof ele.selectionStart != 'undefined')
alert(ele.selectionStart);
}
</script>
</head>
    <body>
<textarea rows="8" cols="30" onclick="contar(this)">Un conjunto de frases</textarea>
</body>
</html>

Panino5001 · #5 (**permalink**) 10/07/2009, 23:56

Un ejemplo para textarea e input (explorer obliga a usar caminos diferentes):

Código:

<!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=iso-8859-1" />
<title>ejemplo</title>
<script>
function devPos(input){
if(typeof document.selection != 'undefined' && document.selection && typeof input.selectionStart == 'undefined' || input.selectionStart=='vacio'){
var str =document.selection.createRange();
var stored_range = str.duplicate();
stored_range.moveToElementText(input);
stored_range.setEndPoint( 'EndToEnd', str );
input.selectionStart = stored_range.text.length - str.text.length;
input.selectionEnd = input.selectionStart + str.text.length;
alert(input.selectionStart);
input.selectionStart='vacio';
}else if(typeof input.selectionStart != 'undefined'){
alert(input.selectionStart);
}
}
function devPos2(input){
if(typeof document.selection != 'undefined' && document.selection && typeof input.selectionStart == 'undefined'){
var range = document.selection.createRange();
var bookmark = range.getBookmark();
var caret_pos = bookmark.charCodeAt(2) - 2;
alert(caret_pos)
}else if(typeof input.selectionStart != 'undefined'){
alert(input.selectionStart);
}
}

</script>
</head>

<body>
(click sobre los campos para obtener la posición del cursor)
<form id="form1" name="form1" method="post" action="">
  <textarea name="area" rows="1" id="area" onclick="devPos(this)">esta es una prueba</textarea>
  
  <br />

  <input name="campo" type="text" id="campo" value="ver qu&eacute; pasa en textfield" size="60" onclick="devPos2(this)" />
</form>
</body>

</html>

Más info:
http://www.disegnocentell.com.ar/notas2.php?id=206