JavaScript Document.execommand - kopieren fast ohne styles

-Rayz-

Lieutenant
Registriert
Okt. 2010
Beiträge
901
Guten Abend,

wenn ich Text kopiere und nur die Struktur behalten möchte, kopiere ich den Text in den normalen Editor von Windows um die ganzen Styles loszuwerden. Kopiere ich diesen Text dann z.B. in Word rein, sind die Zeilenumbrüche noch vorhanden und die styles weg.

Genau dieses verhalten versuche ich in einem Textfeld hinzubekommen.
Wenn ich den Text via text/html hole und mit document.execommand InsertHTML einfüge, sind noch alle styles drin. Der Befehl paste funktioniert auch nicht und mit text/plain verliere ich ja alles - auch die Zeilenumbrüche, Listen etc.

Gibt es eine Möglichkeit, Text wie oben beschrieben auch in der Webumgebung vom Clipboard aus zu kopieren / einzufügen?

Vielen Dank
 
Was du suchst geht nicht mit einem Input. Versuch es Mal mit textarea da sollte es imo direkt schon so gehen. Dann den Text aus dem textarea entnehmen.
 
Im normalen Textarea geht es, aber leider nicht wenn mein Editor noch funktionieren soll.. da werden weiterhin alle styles mitkopiert.
Ergänzung ()

Hab mal ausprobiert den Text zuerst in ein normales Textarea zu kopieren und von dort aus dann in das Textareafeld, wo mein Editor dran hängt:

Javascript:
  insertText(e: any): void {
    e.preventDefault();
    const selectedElement = this.saveSelection();
    const ele = document.getElementById('testarea');
    ele.focus();
    const text = (e.originalEvent || e).clipboardData.getData('text/html');
    document.execCommand('insertHTML', false, text);
    this.restoreSelection(selectedElement);
    document.execCommand('insertHTML', false, ele.value);
  }

Funktioniert natürlich nicht..
Wenn ich den Inhalt untersuche sehe ich die Umbrüche. Allerdings wird durch den Editor ein Umbruch nur dann sichtbar, wenn ein <br> bzw. der Bereich durch ein <div></div> geteilt wird...
 
Zuletzt bearbeitet:
Verstehe ehrlich gesagt nicht was du versuchst. Was meinst du mit mein Editor?

Was soll das insertHtml?
Ich würde clipboard.text() auslesen und in textarea.value reinschreiben.
 
Wie hier im Forum das Textfeld habe ich halt auch einen Editor. Ich will aber beim copy/paste nichtde n ganzen Style haben sondern den Effekt, als würde ich es in eine Textarea kopieren. Wenn die Textarea aber contenteditable ist, hab ich den Effekt nicht mehr und ich kann nur zwischen Text/html und ext/plain auswählen.

Ich möchte beim kopieren aber die Zeilenumbrüche nicht verlieren. Und in einem Editierbaren Textarea Feld gibt es halt den Zeilenumbruch durch ein weiteres Div bzw. durch ein <br>.
Ich hatte noch versucht, nach CR LF zu suchen und es via replace gegen ein <br> auszutauschen aber das funktioniert leider auch nicht.
 
Die WYSIWYG Editoren auf Webseiten sind kein HTML Standard. Darum ist es im Einzelfall unterschiedlich, wie sie sich verhalten.
Meine Aussage gilt für HTML textara. Dort bekommst du die Zeilenumbrüche als \n (LF).
Diese könntest du dann per replace ersetzen in BR Elemente oder was auch immer
 
Zurück
Oben