2009-12-17 31 views
5

Estoy trabajando en un tokenfield personalizado basado en textarea. La idea es tener un área de texto con elementos div absolutamente posicionados arriba, por lo que se ve como en el área de texto.¿Cómo configuro una selección hacia atrás?

Ha sido doloroso hasta el momento, pero logré hacer casi todo, excepto una cosa.

¿Es posible incluso en javascript establecer la selección inversa? Cuando coloque un cursor en algún lugar en el medio del área de texto, mantenga presionado shift y presione la flecha izquierda varias veces, obtendrá una selección. La parte difícil es que no es habitual, está al revés (el comienzo es hacia la derecha desde el final, no como suele ser). Hay marcadores de posición en mi área de texto sobre los que mostrar mis divs (tokens). Cuando navega hacia uno de ellos, el cursor salta al borde opuesto de un marcador de posición, por lo que se siente natural. Cuando mantienes presionada la tecla shift, y alcanzas el marcador de posición, salta hacia la derecha y establece una nueva selección, por lo que parece que seleccionaste el token (puedes presionar eliminar y eliminar el rango seleccionado con el token, lo que es genial) . Pero no lo puedo posiblemente funciona si se desplaza de derecha a izquierda, ya que el establecimiento de una nueva selección haría unreverted uno:

izquierda a derecha selección:

abcde[start]efg[end](token) 
[shift]+[right] 
abcde[start]efg(token)[end] 
[del] 
abcde 

de derecha a izquierda la selección

(token)[end]efg[start]abcde 
[shift]+[left] 
[start](token)abcdeefg[end] //see? it's back to normal 
[shift]+[left] 
[start](token)abcdeef[end]g //huh?! shift-right moves end point (unexpected) 
abcde 

Así que aquí está la pregunta: ¿Puedo establecer una selección de área de texto donde el punto empezar sería mayor que el punto final? Simplemente element.setSelectionRange(right, left) no funciona en Firefox, ¿alguna otra idea?

+1

¡Muy buena pregunta! – Boldewyn

+0

Esto es MUY interesante, ¿puedo obtener un enlace o es algo supersecreto de la NASA? :) –

+0

Aún es un widget de trabajo en progreso. Pero probablemente podría lanzarlo (es mootools) cuando estoy seguro de que ya está hecho. Aquí hay una imagen para hacerte una idea de cómo funciona: http://img.skitch.com/20091217-89kmqxu8subd5xr8yn1ut7953b.png (resuena para todo tipo de eventos e intenta renderizarlo en un div oculto, luego calcula las posiciones de tokens y reposicionan las cosas sobre textarea) En realidad es un clon de tokenfield en Mail.app en Mac OS X. Muy cerca de clon :) – user233603

Respuesta

1

Después de experimentar un poco en la consola Firebug, creo que no es trivial. Sin embargo, puede interceptar el evento de pulsación de tecla:

Si el usuario presiona la flecha izquierda, debe extender la selección a la izquierda y devolver false. Entonces no se invoca el valor predeterminado del navegador, pero el usuario tiene, no obstante, la sensación de una selección hacia la izquierda.

textarea.onkeypress = function (event) { 
    if (!event){event = window.event; /* %#$! IE */ } 
    if (event.shiftKey && event.keyCode == 37 /* left */) { 
    event.target.selectionStart = currentSelectionStart - 1; 
    } 
    return false; 
}; 

37 es la flecha hacia la izquierda, es decir hasta 38, 39 es la derecha y 40 es hacia abajo.

+0

Sí, pero tampoco es trivial, porque tendré que escuchar todos los eventos que probablemente podrían diseccionar una parte del texto o establecer una nueva selección. Pero de alguna manera creo que será la única forma (incluso si no es fácil rastrear los eventos de selección de selección x-browserly). Gracias por intentarlo. – user233603