[SOLUCIONADO] Insertar bullet cada vez que se presion [ENTER] en text area

SI TAN SOLO TUVIERA · #1 (**permalink**) 05/01/2012, 01:18

Hola. Alguien sabe si esto se puede hacer con JavaScript? o necesito buscar en otro lenguaje?

Tengo un "textarea" y quisiera que cada que el usuario aprete la tecla [ENTER] la siguien línea empiece con un bullet como por ejemplo —, », *, etc.

Si alguien sabe cómo podría hacer esto le agradezco l ayuda.

nilburcion · #2 (**permalink**) 05/01/2012, 05:04

Cero que esto es lo que buscas:

Código:

<textarea id="texto" onkeyup="javascript:bullet('*')"></textarea>

<script>
function bullet(simbolo) {
if(window.event.keyCode==13) {
texto.value=texto.value+simbolo;
}
}
</script>

SI TAN SOLO TUVIERA · #3 (**permalink**) 05/01/2012, 11:10

Joder!! no puedo creer lo hayas hecho tan sencillo. Estuve buscando esto por horas anoche en Google tanto en Inglés como en Español sin encontrar nada.

Te agradezco mucho la ayuda nilburcion

funciona perfecto y tal cual.

SI TAN SOLO TUVIERA · #4 (**permalink**) 05/01/2012, 11:21

Hola Nilburcion, no sé me puedes dar una última ayuda. El Script me funciona cuando el textarea está vacio, pero cuando hay texto en éste, pone el bullet al final del texto.

Lo que quiero hacer es, por ejemplo tengo este textarea ya con texto:

Código:

uno, dos, tres, cuatro, cinco

Quiero pararme o poner el cursor en cada cada (,) y que cuando presione ENTER se ponga en la siguiente línea el bullet de primero junto con el texto que tenga por delante del cursor, para que al final quede así:

Código:

» uno
» dos
» tres
» cuatro
» cinco

Será que habría que hacerle mucho al script para que funcione así y que no ponga el bullet al final del texto?

Gracias de nuevo.

Dnielf · #5 (**permalink**) 05/01/2012, 11:45

Solo una idea : Cuando presionas enter se agrega el caracter \n (\r\n o el unicode correspondiente), con lo que el algoritmo sería así :

- Presionar enter
- Revisar innerHTML del textarea y agregar el bullet después del reciente \n.

Sería mejor obtener la ubicación de la inserción del texto (keyup) en un textarea pero no conozco método o propiedad alguna correspondiente al evento.

SI TAN SOLO TUVIERA · #6 (**permalink**) 06/01/2012, 02:17

Cita:

Iniciado por Dnielf

Solo una idea : Cuando presionas enter se agrega el caracter \n (\r\n o el unicode correspondiente), con lo que el algoritmo sería así :

- Presionar enter
- Revisar innerHTML del textarea y agregar el bullet después del reciente \n.

Sería mejor obtener la ubicación de la inserción del texto (keyup) en un textarea pero no conozco método o propiedad alguna correspondiente al evento.

Gracias Dnielf. Si tu que sabes de lo que estás hablando no conoces metodo o propiedad alguna, mucho menos yo

me estás hablando en chino.

nilburcion · #7 (**permalink**) 06/01/2012, 08:06

Hola,
Por cierto gracias por la idea Dnielf.
Lo que hay un problema...
No existe ningun metodo o funcion capaz de detectar la posicion del cursor respecto al texto.

Pero para eso podemos usar una libreria de Pepe Molina (Caricatos).

Entonces el codigo quedaria así:

Código:

<body onload="elEditor = ini_editor(texto)">

<script>var elEditor;</script>
<script scr="http://www.pepemolina.com/editor/editor.js?PHPSESSID=cbe33f70botbod1t96t60gurs6"></script>

<textarea id="texto" onkeyup="javascript:bullet('»')"></textarea>

<script>
function bullet(simbolo) {
if(window.event.keyCode==13) {
_insertar(elEditor, simbolo);
}
}
</script>
</body>

Si quieres puedes descargarte la libreria desde aqui: http://www.pepemolina.com/editor/editor.js?PHPSESSID=cbe33f70botbod1t96t60gurs6

SI TAN SOLO TUVIERA · #8 (**permalink**) 06/01/2012, 15:08

Ensayé lo que sugieres tal cual al pie de la letra. Descargue la librería de Caricatos al servidor mio también, pero pues la verdad que no me funcionó. No ocurre nada. De todos modos te agradezco la ayuda Nilburcion.

nilburcion · #9 (**permalink**) 06/01/2012, 15:25

Perdooon!!!!!
je,je...

que error mas tonto...

lo que pasa es que javascript por motivos de seguridad no permite acceder a otros dominios.
Pero si te descargaste la librería corrige la cuarta linea por:

Código HTML:

<script scr="aqui pon la ruta de tu libreria*"></script>

*por ejemplo: librerias/bullet.js

Espero que así te funcione

SI TAN SOLO TUVIERA · #10 (**permalink**) 06/01/2012, 15:33

Gracias Nilburcion, pero así fue que lo hice. Descargue el .js al root de la página donde lo estoy probando y en el código fuente, puse a que lo leyera diréctamente de éste.

Lo ensayé de ambas formas:

Cita:

Cita:

Pero naranjas.

nilburcion · #11 (**permalink**) 06/01/2012, 15:42

Ya se...
No es scr sino src

SI TAN SOLO TUVIERA · #12 (**permalink**) 06/01/2012, 15:54

joderrr!! MAESTRO! ahora sí a la perfección. El que sabe sabe y el que no sabe es como el que no ve. Mis respetos Nilburcion. Te quedo agradecido!

enlamochila · #13 (**permalink**) 30/01/2013, 05:31

Perfecto.. muchas gracias... muy útil.

Oscar