simulieren Sie die Cursortasten (links, rechts, nach unten, nach oben Pfeile) in einem editierbaren Div Inhalt?

Question

Ist es möglich, die Pfeiltasten auf einem Inhalt editierbare Div zu simulieren? Ich habe versucht, "key press" -Ereignisse auszulösen, aber es scheint, dass contenteditable sie ignoriert. (Ich brauche nur eine Webkit/Safari-Lösung)

Ich muss nur das Caret innerhalb der div wie die Pfeiltasten tun, aber programmatisch.

Vielleicht kann die Rangy-Bibliothek von Tim Down helfen?

Danke!

Answer 1

Es ist schwierig, weil es unmöglich ist, ein Schlüsselereignis im Allgemeinen vollständig zu simulieren. Insbesondere ist es in den meisten Browsern nicht möglich, die Standard-Browseraktion für ein Schlüsselereignis auszulösen, ohne dass ein tatsächlicher Tastenanschlag aufgetreten ist.

Das ist der Fall, Sie müssen es manuell tun, was kompliziert ist. Die Pfeiltasten funktionieren mit dem sichtbaren Text auf der Seite, was bedeutet, dass Sie Dinge wie kollabierte Leerzeichen, implizierte Zeilenumbrüche von <br> und Blockelemente, Elemente, die über die CSS-Eigenschaft display versteckt sind, und viele andere Feinheiten berücksichtigen müssen. Das Simulieren von Aufwärts- und Abwärtspfeilen beruht auch auf dem Erhalten exakter Pixelkoordinaten beliebiger Zeichen auf der Seite, was in den meisten Browsern nicht trivial ist.

Ich arbeite an einem Mittel zum Navigieren durch den sichtbaren Text auf der Seite in Rangy, die beim Simulieren von linken und rechten Pfeiltasten helfen wird, aber Rangy kann nicht mit den Pfeiltasten nach oben und nach unten helfen.