Wie Css dynamisch zu CSSEDITOR ohne eine CSS-Datei hinzufügen

Question

Ich habe eine Situation, in der ich dynamische CSS-Daten über ein Textobjekt in einer Datenbank als JSON speichern. Ich muss die gleichen CSS-Daten in Styles in CKEditor abbilden. Ich bin erfolgreich in der Lage, die Klassen in die CKEditor Stilen Dropdown-Liste zu laden, indem Sie die json in den durch Laufen eingestellt Stil Parsen:

CKEDITOR.stylesSet.add('myStyles',styleObj); 

Leider ist dies nicht vollständig mit dem Text auf dem Bildschirm arbeiten, weil die CSS nicht als Datei nicht existiert .

Ich habe auch erfolgreich die CSS in den Kopf des Doms durch Anhängen der dynamisch generierten CSS an ein Stil-Tag. Leider verbindet dies immer noch nicht die tatsächlich erzeugte css mit dem CKEDITOR, da es sich in einem separaten Kontext befindet.

Weiß jemand, wie ich Dokumentenebene css entweder an die CKEDITOR-Instanz anschließen kann oder CSS so generieren kann, dass CKEDITOR es versteht? Ich würde es vorziehen, für jeden einzelnen Benutzer, der das Textobjekt sehen muss, keine temporäre CSS-Datei auf die Festplatte zu schreiben.

Answer 1

Ich habe die Antwort gefunden, indem ich die CKEDITOR.addCss() - Funktion verwendet habe. Anstatt zu versuchen, die CSS in den Dokumentkopf als Stile zu laden, kann der Prozess durch Ausführen der CKEDITOR.addCss() - Funktion viel einfacher sein.

Der Code sieht so aus:

für jeden CSS-Stil im json gefunden:

styleObj.push({name:this.name,element:'p',attributes: { 'class':cssClassName}}); 
    var cssSheetString = '.'+cssClassName+' {font-family:'+this.fontFamily+'; font-size:'+fontSize+'; font-weight:'+this.fontStyle+'; text-decoration:'+textDecoration+'; } '; 
    CKEDITOR.addCss(cssSheetString); 

nach den Schlaufenenden fügen Sie dann auch die Stile Objekt:

if(!CKEDITOR.stylesSet.registered.myStyles){ 
       CKEDITOR.stylesSet.add('myStyles',styleObj); 
      }