EN · DE · RU · FR · ES

#2760: select.js

projectforge-webapp/src/utilities/select.js DOM-Hilfsprogramm (einzelner Export) · projectforge-webapp/src/utilities/select.js 17 Zeilen · 14 Code · 2 Kommentare · 1 leer
Ein browserübergreifendes Textauswahl-Hilfsprogramm, das programmatisch den gesamten Textinhalt eines DOM-Knotens auswählt und so ein Ein-Klick-Kopieren für schreibgeschützte Textfelder ermöglicht. Die Funktion behandelt zwei Ären von Browser-APIs: den Legacy-Internet-Explorer-Ansatz mit createTextRange und den modernen, standardbasierten Ansatz mit window.getSelection() / document.createRange(). Sie wird von der Komponente DynamicReadonlyField aufgerufen, sodass ein Klick auf ein schreibgeschütztes Feld dessen Text für einfaches Kopieren und Einfügen auswählt.

Architektur

Zweigleisiger Codepfad

Die Funktion verzweigt bei document.body.createTextRange – diese Eigenschaft existiert nur im Internet Explorer (und frühen Edge-Versionen). Ist sie vorhanden, wird das IE-eigene TextRange-Objekt verwendet, wobei moveToElementText den Bereich auf den Inhalt des Knotens eingrenzt und anschließend select() ihn hervorhebt. Fehlt die Eigenschaft (alle modernen Browser), wird die W3C-Selection-API genutzt: Ein Range-Objekt wird erstellt, selectNodeContents auf den Zielknoten angewendet, eine eventuell vorhandene Auswahl gelöscht und der neue Bereich hinzugefügt.

Verwendungskontext

Importiert von den DynamicLayout-Eingabekomponenten, insbesondere DynamicReadonlyField. Wenn ein Benutzer auf ein schreibgeschütztes Feld klickt (z. B. eine berechnete Kostenstellennummer oder eine systemgenerierte Kennung), wird der gesamte Textinhalt automatisch ausgewählt, sodass ein sofortiges Kopieren via Strg+C / Cmd+C ohne manuelles Ziehen und Auswählen möglich ist. Quellenverweis für den Algorithmus: Stack Overflow Antwort #987376.

Git-Verlauf

Commit Was geändert wurde
21305e884 Zwei Kommentare hinzugefügt: eine Quellenangabe mit Verweis auf die Stack-Overflow-Antwort, von der der Algorithmus abgeleitet wurde, sowie ein Inline-Label // internet-explorer oberhalb des createTextRange-Zweigs, um zu erklären, warum zwei verschiedene Auswahl-APIs verwendet werden. Keine funktionalen Änderungen.
117f7fe25 Datei mit der browserübergreifenden Textauswahlfunktion und ihrem Standardexport erstellt. Dies war Teil der Implementierung des „Klicken zum Auswählen“-Verhaltens für schreibgeschützte Felder im dynamischen Formularlayout der Webanwendung.