Holen Sie sich formatiertes HTML von CKEditor

Lesezeit: 4 Minuten

Benutzer-Avatar
schlafend

Ich verwende CKEditor in meiner Web-App und weiß nicht, wie ich den Inhalt des Editors mit HTML-Formatierung abrufen kann.

var objEditor = CKEDITOR.instances["sectionTextArea"];
var q = objEditor.getData();

Dadurch bekomme ich den in CKEditor eingegebenen Text ohne Markup.

Jedoch,

var q = objEditor.getHTML();

gibt einen Nullwert zurück. Was mache ich falsch?

getHTML ist keine Methode eines CKEditor-Objekts, daher sollten Sie anstelle von null einen Javascript-Fehler haben.

Die von der API definierte Methode ist Daten bekommen() Wenn das nicht funktioniert, haben Sie ein anderes Problem in Ihrem Code. Versuchen Sie, eine Warnung zu verwenden, um den Inhalt in diesem Moment zu überprüfen.

  • Wenn Sie meinen, dass sie einige console.log hätten verwenden sollen, hätten Sie erkennen müssen, dass der Benutzer versucht hat, eine nicht vorhandene Methode zu verwenden. Wenn er also auf die Konsole geschaut hätte, hätte er den Fehler gesehen. Anstatt ihm alle Details zum Debuggen von Javascript zu erklären (und die mögliche Notwendigkeit, ein zusätzliches Add-On zu installieren oder den Browser zu wechseln, denken Sie daran, dass er dies vor vier Jahren gefragt hat), besteht die kugelsichere Methode darin, eine Warnung zu verwenden, die bereitstellt die Info und es besteht keine Notwendigkeit, es weiter zu erklären.

    – AlfonsoML

    17. September 2014 um 14:30 Uhr

  • IMHO ist die Verwendung von Alert zu Debugging-Zwecken eine sehr schlechte Praxis und sollte niemandem leichtsinnig empfohlen werden. (Da SO vor allem für Anfänger eine bekannte Ressource ist)

    – ˈvɔlə

    18. September 2014 um 12:45 Uhr

  • Es wäre also besser für Sie gewesen, wenn ich geschrieben hätte: “oder lernen, wie man Javascript mit einem geeigneten Browser debuggt” ? Das ist nicht hilfreich. Die Benachrichtigung funktioniert immer und ohne Anforderung in jedem Browser. Ich würde gerne sehen, wie Sie vor vier Jahren eine Webseite auf Mobilgeräten ohne Benachrichtigung debuggt haben.

    – AlfonsoML

    18. September 2014 um 15:30 Uhr

  • @Wolle verwenden alert() Anstatt von console.log() ist gut für Anfänger, da Sie die Ausführung bei der Verwendung anhalten können alert(), Wenn es sich um console.log() handelte, müssten Sie das Debugger-Schlüsselwort verwenden, um die Ausführung anzuhalten. Sowohl console.log() als auch alert() haben ihre eigenen Vorteile. Ich weiß, dass die meisten Anfänger alert() anstelle von console.log() verwenden, aber das macht das eine oder andere nicht zu einer schlechten Praxis. Verwenden Sie es einfach nicht in der Produktion. Wenn es schlecht war, hätten die Browser es entfernt.

    – 27px

    2. Dezember 2020 um 10:41 Uhr

Benutzer-Avatar
niedrige_mieten

nur um zu wissen, dass dies die richtige Methode dafür ist getData() hat mir nicht geholfen. Ich wusste nicht, wie ich es für das CKEditor-Objekt verwenden sollte. und CKEDITOR.getData() funktioniert nicht.

das ist wie getData() wird auf dem CKEDITOR-Objekt verwendet:

CKEDITOR.instances.my_editor.getData()

…wo my_editor ist die ID Ihres Textbereichs, der für CKEditor verwendet wird.

Das Gegenteil davon ist setData():

CKEDITOR.instances.my_editor.setData("<p>My Text</p>");

Benutzer-Avatar
Tomasz Dzięcielewski

Um htmlData aus dem Editor zu erhalten, sollten Sie das folgende Code-Snippet verwenden:

var htmldata = CKEDITOR.instances.Editor.document.getBody().getHtml();

Wenn diese Lösung nicht funktioniert, überprüfen Sie, ob dies der Fall ist BBCode Plugins deinstalliert.

  • Ausnahmedokument ist nicht definiert

    – panky Sharma

    7. Oktober 2014 um 11:33 Uhr

  • Denken Sie daran, dass Sie ersetzen sollten Editor nach Ihrem Instanznamen, in meinem Fall war es zum Beispiel: CKEDITOR.instances.sfw_fc_fccd_e2_dui27_fcUse_fccd_e16_dui27_fcUse_fccd_e2_dui31_tbTextGeneratorUse.getData() da ich es in ASP.Net verwendet habe und der Instanzname lautete sfw_fc_fccd_e2_dui27_fcUse_fccd_e16_dui27_fcUse_fccd_e2_dui31_tbTextGeneratorUse.

    – Muhammad Musawi

    11. April 2019 um 8:37 Uhr


Bitte aktualisieren Sie ckeditor config.js mit der folgenden Zeile

config.fullPage = true;

Dadurch wird der vollständige HTML-Code zurückgegeben, wenn Sie getData () anfordern.

Benutzer-Avatar
Flezcano

Das hat bei mir funktioniert:

CKEDITOR.instances["id"].getData()

Benutzer-Avatar
Emanuel Disco

Ich verwende das Vorschau-Plugin, um den vollständigen HTML-Inhalt abzurufen, ich hoffe, es hilft.

CKEDITOR.getFullHTMLContent = function(editor){
	var cnt = "";
	editor.once('contentPreview', function(e){
		cnt = e.data.dataValue;
		return false;
	});
	editor.execCommand('preview');
	
	return cnt;
}

Benutzer-Avatar
Amarjeet Singh

Für Java-Benutzer…

Nachdem Sie auf die Schaltfläche „Senden“ geklickt haben, erfolgt die Anfrage über die HTTP-Post-Methode. Diese Post-Anforderung enthält auch den formatierten HTML-Code in dem Parameter, der unter Verwendung des Namensattributs des Textbereichs benannt wurde.

Also, wenn Ihr Textbereich so etwas wie …

<form method="post" action="createPDF.do"> <textarea name="editor1" id="editor1"/>
<input type="submit"/> </form>

Nachdem Sie auf die Schaltfläche „Senden“ geklickt haben, können Sie das formatierte HTML in Ihrem Servlet/Controller abrufen, indem Sie:

String htmlContent = request.getParameter("editor1");

Sie können diese Variable, die das formatierte HTML (‘htmlContent’) enthält, auch an ITEXT (oder einige andere PDF-Konverter) übergeben, um das PDF zu erstellen …

1136480cookie-checkHolen Sie sich formatiertes HTML von CKEditor

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy