editierbare Bereiche im Fließtext.
Gernot Back
- javascript
0 wahsaga0 Gernot Back0 wahsaga
Hallo Leute,
ich weiß, eigentlich sollte ich in dem anderen Thread
https://forum.selfhtml.org/?t=90490&m=542764
bleiben, aber da ich sonst möglicherweise wieder in den Verdacht gerate, völlig vereinsamte Selbstgespräche zu führen, mache ich mal einen neuen draus, zumal das Thema ja nun auch etwas spezieller wird.
Ich habe mal versucht, etwas für alle Browser nachzubauen, was dem proprietären MSIE-Attribut contenteditable="true" entspricht. Ich weiß, davon bin ich noch weit entfernt, weil neue Textfelder in meinem Formular bis jetzt immer nur ganz hinten angehängt werden, aber das lässt sich bestimmt auch noch regeln.
Zuerst würde ich nur gerne mal eine Lösung für Mozilla finden, der im Moment total zickt und den ersten Buchstaben eines neuen Wortes immer noch an das alte dranhängt und das neue Wort dann von diesen ersten Buchstaben abschneidet - anders als die anderen Browser. Vermutlich ist das ein Problem des EventHandlings mit KEYPRESS.
Mit dem CSS in Mozilla und Opera bin ich auch nicht zufrieden: Da wird die font-family:monospace, wenn durch Form-Element unterbrochen, teilweise im Paragraphen-Element nicht fortgeführt. Das Form-Element verweigert sich seinerseits teilweise dem display:inline.
Wer hat Ideen zur Verbesserung?
Worum es geht, seht ihr am besten in der Praxis. Ich habe es mal ins Netz gestellt:
http://www.sprachlernspiele.de/editable
Gruß Gernot
hi,
ob's was zur lösung des problems beiträgt, weiß ich nicht, aber -
var letzt = x.value.substring(x.value.length-1,x.value.length);
var vorLetzt = x.value.substring(x.value.length-2,x.value.length-1);
ein vorheriges und vor-vorheriges zeichen sind doch noch gar nicht vorhanden, wenn erst ein bzw. zwei zeichen ins textfeld eingegeben wurden - folglich existieren auch die beiden indizes value.length-1 und value.length-2 auch noch gar nicht inm string, und das wird soweit ich sehe in diesem kurzen javascript auch nirgends abgefangen.
gruß,
wahsaga
Hallo Wahsaga,
ja, mit dem vorLetzt habe ich rumexperimentiert und es dann (leider nur unvollständig wieder rausgenommen, da es nicht funktioniert hat.
Komisch halt, dass Opera und MSIE mit dem Ansatz keine Probleme haben. Ich glaube ozilla hat einfach eine lange Leitung, vielleicht auch eine zu kurze, und hat das neue Zeichen schon ins alte Feld geschrieben, bevor der EventHandler aktiv wird.
Gruß Gernot
hi,
ja, mit dem vorLetzt habe ich rumexperimentiert und es dann (leider nur unvollständig wieder rausgenommen, da es nicht funktioniert hat.
Komisch halt, dass Opera und MSIE mit dem Ansatz keine Probleme haben. Ich glaube ozilla hat einfach eine lange Leitung, vielleicht auch eine zu kurze, und hat das neue Zeichen schon ins alte Feld geschrieben, bevor der EventHandler aktiv wird.
ich habe jetzt einfach mal den eventhandler onKeyPress durch onKeyDown ausgetauscht, also an den beiden stellen
neuWort.onkeydown=setEvt;
innerhalb deiner funktion, und
<input onKeyDown="passAn(this)" [...]
innerhalb des HTML-teils - und damit erziele ich im mozilla das gleiche ergebnis wie im IE und opera.
(allerdings ist die lösung natürlich noch lange nicht perfekt - wenn du z.b. mal mit [cursor nach links] einen oder mehrere schritte zurückgehst und weiter tippst, dann erreichst du durch eingabe eines leerzeichens natürlich nicht mehr die erstellung eines neuen feldes ...)
gruß,
wahsaga
Danke Wahsaga,
ich habe jetzt einfach mal den eventhandler onKeyPress durch onKeyDown ausgetauscht, also an den beiden stellen
neuWort.onkeydown=setEvt;
innerhalb deiner funktion, und
<input onKeyDown="passAn(this)" [...]
innerhalb des HTML-teils - und damit erziele ich im mozilla das gleiche ergebnis wie im IE und opera.
Ich werde morgen mal weiter experimentieren mit einer Browserweiche, die ggf. beide EventHandler verwendet und auch mit neu zu generierenden INPUT-Feldern zwischen bereits bestehenden. Ich denke dabei daran, nextSibling abzufragen davor eizufügen. Das müsste ja dann im Prinzip alles zu machen sein, ist zwar alles erst einmal nur Spielerei mit dem Node-Objekt, aber wer weiß, wofür das mal gut ist.
Danke.
Gruß Gernot