Foros del Web » Programando para Internet » Javascript »

input text con texto invertido, javascript

Estas en el tema de input text con texto invertido, javascript en el foro de Javascript en Foros del Web. Hola gente, a ver si alguien me puede ayudar. Estuve buscando como hacer esto por todos lados y no he encontrado nada. Estoy haciendo un ...
  #1 (permalink)  
Antiguo 17/06/2012, 19:04
Avatar de fefiss  
Fecha de Ingreso: septiembre-2011
Ubicación: Montevideo
Mensajes: 9
Antigüedad: 12 años, 7 meses
Puntos: 0
input text con texto invertido, javascript

Hola gente, a ver si alguien me puede ayudar. Estuve buscando como hacer esto por todos lados y no he encontrado nada.
Estoy haciendo un trabajo para la facultad y tengo que generar un sistema de cuentas (adición, substracción, división, multiplicación) aleatorias de n dígitos.
Lo que quiero saber es si hay alguna forma de que al momento de ingresar el resultado de cada cuenta, si se puede poner el cursor delante del último dígito ingresado. Por ejemplo:

425
+ 634
______
______
[_1059_] -----> este es el input text donde ingreso el resultado

Quiero que se ponga el cursor delante de cada número que ingreso, cosa de no tener que mover el cursor con la flecha izquierda del teclado dentro del input de texto.
Espero haberme explicado, y muchas gracias por su ayuda y su atención.
Saludos!
  #2 (permalink)  
Antiguo 17/06/2012, 21:46
Avatar de dontexplain  
Fecha de Ingreso: junio-2012
Mensajes: 536
Antigüedad: 11 años, 10 meses
Puntos: 127
Respuesta: input text con texto invertido, javascript

Para eso, en navegadores como Firefox o Chrome (excepto IE) puedes usar el método setSelectionRange...

setSelectionRange establece el inicio y el final del rango actual de selección del cursor, claro que si no hay nada seleccionado, el inicio del rango de selección tiene que coincidir con la posición del cursor.

por ejemplo, si yo tengo el texto ejemplodetexto y lo selecciono quedaría en

ejemplodetexto

donde o es el comienzo del cursor, y el cursor por tanto se situará ahí. ¿Cómo hacer lo contrario? Usando text-align:right


e = document.getElementById('input');

if(e.setSelectionRange){

e.setSelectionRange(0,0); // en dos parámetros simples se establece el rango
e.focus(); // rango vacío, se hace foco

} else if(e.createTextRange){

rango = e.createTextRange(); // se invoca el método
rango.moveat("character", 0); // el inicio del rango es el caracter 0
rango.moveEnd("character", 0); // el final del rango es el caracter 0
rango.select(); // el método para invocar la selección finalmente
}

Y así se simple se establece un rango de selección vacío con el cursor al inicio del rango.

Un saludo.
  #3 (permalink)  
Antiguo 18/06/2012, 15:54
(Desactivado)
 
Fecha de Ingreso: noviembre-2002
Ubicación: Ciudad Autónoma de Buenos Aires
Mensajes: 2.367
Antigüedad: 21 años, 6 meses
Puntos: 317
Respuesta: input text con texto invertido, javascript

No estoy seguro de entender el problema.
¿Tendrá que ver conque la grafía arábiga, y por lo tanto nuestra numeración, se escriben de derecha a izquierda?. En realidad nosotros ya nos acostumbramos a leer y escribir cifras en el mismo sentido que el texto, pero claramente el sistema está hecho "al revés". Por algo los números enteros se alinean a la derecha en las tablas.

Dejo alguna sugerencia, y el enlace de donde la saqué.

Código:
<input type=text style="direction: rtl; unicode-bidi: bidi-override; text-align:left">
rotar horizontalmente texto e imágenes con javascript
  #4 (permalink)  
Antiguo 20/06/2012, 14:28
Avatar de fefiss  
Fecha de Ingreso: septiembre-2011
Ubicación: Montevideo
Mensajes: 9
Antigüedad: 12 años, 7 meses
Puntos: 0
Respuesta: input text con texto invertido, javascript

Buenas! Muchas gracias por sus respuestas dontexplain y furoya, y perdón por la demora en contestar.. Probé con las dos explicaciones que ustedes me dieron, pero por mi falta de experiencia en la programación no pude hacer lo que quería. :(
La solución de furoya sirve, en parte. Escríbe de derecha a izquierda como quiero, lo que pasa es que el valor que ingreso en el campo de texto tambien queda invertido, y como tengo que calcular el resultado de una cuenta, ya no me sirve.
Por ejemplo, tengo esta cuenta:

321
+ 521
___________
[ ] -----> input text

Me gustaría que al poner el cursor en el campo de texto, y escribír el resultado no tenga que mover el cursor hacia la izquierda con la flecha del teclado para que coincida con cada conlumna en la suma.

Lo que pensé es invertír el resultado que calculo en una variable y comparar con el valor invertido que ingresó el usuario.
Será posible?

Esto me sirvió, pero como dije antes, me invierte la escritura y el valor que se ingresa en el campo de texto.

<input type=text style="direction: rtl; unicode-bidi: bidi-override; text-align:left">

No se si me explico de nuevo pero gracias por leer y por su ayuda.
Saludos
  #5 (permalink)  
Antiguo 20/06/2012, 15:36
(Desactivado)
 
Fecha de Ingreso: noviembre-2002
Ubicación: Ciudad Autónoma de Buenos Aires
Mensajes: 2.367
Antigüedad: 21 años, 6 meses
Puntos: 317
Respuesta: input text con texto invertido, javascript

Sí. Clarísimo.

Pero digamos que la idea original era escribir de derecha a izquierda, porque al hacer la suma se empieza por las unidades, luego se suman las decenas, después las centenas ... Y así hay que escribir el número "al revés".
El problema es que para procesar el resultado, tenemos que invertirlo.

Una forma fácil y muy objetable sería

Código:
<script type="text/javascript">
function adicion() {
var prueba = (document.getElementById("sumando0").value*1 + 
document.getElementById("sumando1").value*1) == 
document.getElementById("sumatoria").value.split('').reverse().join('')*1 ? 
"Correcto." : "Incorrecto.";

alert(prueba)
}
</script>

<input style="font-family: monospace; text-align:right;" type=text disabled=true 
value = "54321" id=sumando0><br>

<input style="font-family: monospace; text-align:right;" type=text disabled=true 
value = "54321" id=sumando1> +<br>

<input style="direction: rtl; unicode-bidi: bidi-override; text-align:right; 
font-family: monospace; border-width: 2px 1px 1px; border-color: black" type=text
id=sumatoria><br>
<input type=button value=SUMA onclick="adicion()">
Allí tienes escritos los dos sumandos, y le dejas a un alumno el resultado para tipear.
Aclarando que como está invertido, [Supr] borra hacia la izquierda, y [BkSp] a la derecha.

Etiquetas: input, jquery, txt
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 03:29.