Tinymce-Ansichtsmodus wechselt nach Init

StackOverflow https://stackoverflow.com//questions/25054335

Frage

Mein Editor ist tinymce4 +.Es funktioniert in den meisten Teilen sehr gut.

Aber egal was ich tue, es gibt etwas, das ich einfach nicht tun kann.- sofortiger Wechsel des Editormodus.-

Ich habe eine Seite, auf der Benutzer Daten auswählen, bearbeiten und den Inhalt anzeigen können.Benutzer klicken auf eine Schaltfläche mit dem Namen "Ansichtsmodus", die andere Rückseite ist " Bearbeitungsmodus"

Das habe ich erreicht, indem ich zwei DIVs in demselben Container, wodurch einer von ihnen durch die vom Benutzer gewählten Start-Look-Einstellungen unsichtbar wird.Ein DIV hat tinymce Editor, das iframe-Tag, und ein anderes hat nur eine Reihe von HTML-Werten, die der Editor enthält.Der Nebeneffekt davon ist jedoch, dass der Inhaltsstil je nach seinen Stilattributen unterschiedlich aussehen kann.

Diese Webanwendung, von der ich jetzt spreche, ist ein bestehendes System, das eine eigene hat CSSs.Es ist so kompliziert, dass Sie, sobald Sie es sich ansehen, vielleicht davor davonlaufen möchten.

Also möchte ich das vermeiden CSS diskrepanz, indem der Editor dynamisch auf beide Arten umschaltbar gemacht wird.

Das Laden mehrerer Tinymce-Objekte ist das Letzte, was ich hier brauche.

Ich kann den Editor deaktivieren, indem ich ein Attribut einrichte - contenteditable = false - Aber dann werden die Symbolleistenelemente hier zu bösen Jungs.weil sie immer noch funktionieren.Ich verstecke die Symbolleiste selbst, um diese Mission abzuschließen.

Aber wissen Sie, mein Kunde hasste es und bestand darauf, dass der Editor in seinem Ansichtsmodus eine Druckschaltfläche bereitstellen sollte.Das ist frustrierend.

Wenn Sie mir also nur eine Vorstellung davon geben könnten, wie die Elemente der Symbolleiste manipuliert werden, dann denke ich, dass ich es schaffen kann, dieses Problem zu lösen.

Wenn es zu schwierig ist, könnte das Anhängen des Druckereignis-Listeners an ein externes Element auch die zweitbeste Option für mich sein.Denn von diesem Moment an werfe ich einfach die Symbolleiste weg und erstelle oben im Editor ein Drucksymbol und hänge das Ereignis daran an.

Entschuldigung für die Eingabe aller Klartexte.Aber ein solches Problem erfordert meiner Meinung nach keine Codes.Hoffe, ein kleiner Guru kommt vorbei und hilft mir.

War es hilfreich?

Lösung

Schließlich habe ich meinen Editor umschaltbar gemacht.

Der erste Schritt besteht darin, alle Elemente in der Symbolleiste von auszublenden tinyMCE.

tinyMCE Symbolleisten haben einen bestimmten Klassennamen, sodass sie mit ausgewählt werden können jQuery klassenauswahl.Wenn Sie jedoch nur mit Klassennamen auswählen, werden auch unerwünschte Symbolleisten angezeigt, daher müssen Sie damit vorsichtig sein.

ZU IHRER INFORMATION .eq() API könnte dir helfen.

nachdem Sie alle Elemente in der Symbolleiste ausgeblendet haben (Symbolleiste übrigens nicht ausblenden.) hierzu.

tinymce.ui.Factory.create({
    type: 'button',
    cmd: 'mcePrint',
    icon: 'print',
    shortcut: 'Ctrl+P',
    class : 'temp'
}).renderTo(appendTarget);

Dadurch wird der Symbolleiste ein Schaltflächenelement hinzugefügt.

Aber irgendwie ruft es nicht den Befehl auf, den ich im Wert von cmd definiert habe.

Daher ist es erforderlich, dieses Ereignis manuell an die Schaltfläche anzuhängen.

tinymce.activeEditor.execCommand('mcePrint');

Bisher habe ich eine benutzerdefinierte Symbolleiste für den Ansichtsmodus-Editor erstellt.Jetzt ist es an der Zeit, das eigentliche Inhaltsfeld des Editors einzufrieren.

Es ist sehr einfach, nachdem Sie Iframe-Inhalte als erhalten haben jQuery Objekt.

.contents() API sollte dir helfen.

danach können Sie auswählen <BODY> element auf Ihrer Seite, also müssen Sie als letztes dem Body-Tag das Attribut und den Wert 'contenteditable = false' geben.

Dann friert Ihr Editor ein.

Auch die Rückkehr in den Bearbeitungsmodus ist einfach.Mach einfach das rückwärts.

Rufen Sie diese Ereignisse auf, wenn Sie auf Ihre eigene Schaltfläche "Wechseln" klicken.Dann können Sie Ihren Editor vom Ansichtsmodus in den Bearbeitungsmodus (und auch umgekehrt) umschalten.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top