Wie lege ich eine Rückwärtsauswahl fest?

Question

Ich arbeite an einem benutzerdefinierten Tokenfield basierend auf Textarea. Die Idee ist ein Textarea mit div Elementen absolut oben positioniert, so dass es aussieht wie sie im Textbereich sind.

Es war soweit schmerzhaft, aber ich schaffte es, fast alles zu machen, bis auf eine Sache.

Ist es sogar in Javascript möglich, die umgekehrte Auswahl zu setzen? Wenn Sie einen Cursor irgendwo in der Mitte des Textfelds platzieren, halten Sie die Umschalttaste gedrückt und drücken Sie einige Male den Pfeil nach links, um eine Auswahl zu erhalten. Der schwierige Teil ist, dass es nicht üblich ist - es ist rückwärts (es ist Start vom Ende nach rechts, nicht wie es normalerweise ist). In meinem Textfeld befinden sich Platzhalter, über denen ich meine divs (Token) anzeigen kann. Wenn Sie zu einem von ihnen navigieren, springt der Cursor zum gegenüberliegenden Rand eines Platzhalters, so dass er sich natürlich anfühlt. Wenn Sie die Umschalttaste gedrückt halten und den Platzhalter erreichen, springt er nach rechts und legt eine neue Auswahl fest. Es sieht so aus, als hätten Sie das Token ausgewählt (Sie können Löschen drücken und den ausgewählten Bereich mit dem Token selbst entfernen, was cool ist) . Aber es funktioniert wird nicht möglicherweise, wenn Sie von rechts nach links zu navigieren, da eine neue Auswahl Einstellung wäre es ein nichtumgekehrter machen:

Von links nach rechts Auswahl:

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

Von rechts nach links Auswahl

(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 

Also hier ist Frage: Kann ich eine Auswahl in Textfeld, wo Punkt beginnen würde größer sein als der Endpunkt? Einfach element.setSelectionRange(right, left) funktioniert nicht in Firefox, andere Ideen?

Answer 1

Nach dem Experimentieren ein wenig in der Firebug-Konsole, ich denke, es ist nicht trivial. Sie können jedoch das Tastendruckereignis abfangen:

Wenn der Benutzer den Pfeil nach links drückt, müssen Sie die Auswahl selbst nach links erweitern und false zurückgeben. Dann wird der Standard des Browsers nicht aufgerufen, aber der Benutzer hat trotzdem das Gefühl einer nach links gerichteten Auswahl.

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 ist der linke Pfeil, 38 ist oben, 39 ist rechts und 40 ist unten.