web-dev-qa-db-ja.com

CKEditorからフォーマットされたHTMLを取得します

私は自分のWebアプリでCKEditorを使用していますが、エディターのコンテンツをHTMLフォーマットで取得する方法については迷っています。

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

これにより、CKEditorに入力されたテキストがマークアップなしで取得されます。

しかしながら、

var q = objEditor.getHTML();

null値を返します。私は何を間違えていますか？

javascripthtmlckeditor
30
sslepian

getHTMLはCKEditorオブジェクトのメソッドではないため、nullの代わりにjavascriptエラーが発生するはずです。

Apiで定義されているメソッドは getData（） です。それでもうまくいかない場合は、コードに他の問題がある場合は、アラートを使用してその時点の内容を確認してください。

23
AlfonsoML

このための正しいメソッドがgetData()であることを知っているだけでは助けになりませんでした。 CKEditorオブジェクトで使用する方法を知りませんでした。およびCKEDITOR.getData()は機能しません。

これは、CKEDITORオブジェクトでgetData()がどのように使用されるかです。

_CKEDITOR.instances.my_editor.getData()
_

...ここで_my_editor_はCKEditorに使用されるテキストエリアのIDです。

その反対はsetData()です：

_CKEDITOR.instances.my_editor.setData("<p>My Text</p>");
_
18
low_rents

エディターからhtmlDataを取得するには、以下のコードスニペットを使用する必要があります。

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

このソリューションが機能しない場合は、BBCodeプラグインがアンインストールされているかどうかを確認してください。

9
Tomasz Dzięcielewski

次の行でckeditor config.jsを更新してください

config.fullPage = true;

これは、getData（）をリクエストすると完全なhtmlを返します。

6
MACMAN

これは私のために働いた：

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

プレビュープラグインを使用して完全なHTMLコンテンツを取得しています。

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

私はこれが古いことを認識していますが、意味を成し、画像を含む実際のHTMLを返す答えを見つけるのに苦労しました。 ckeditorインスタンスがtextareaにアタッチされている場合、textareaの値を簡単に取得してHTMLを取得できます。

たとえば、jQueryを使用している場合：

$('#my_editor').val()

APIを詳しく調べる必要はありません。

0
Brent

2つCKEditorがある場合、以下のコードを使用できます。

[〜＃〜] html [〜＃〜]

<textarea name="editor1"></textarea>
<textarea name="editor2"></textarea>

[〜＃〜] js [〜＃〜]

CKEDITOR.replace( 'editor1' );
CKEDITOR.replace( 'editor2' );

var objEditor1 = CKEDITOR.instances["editor1"];
alert(objEditor1.getData()); // get html data

var objEditor2 = CKEDITOR.instances["editor2"];
alert(objEditor2.getData()); // get html data

Online Demo（jsfiddle）

0
Ali Soltani

For Java Users ...

送信ボタンを押した後、リクエストはHTTP Postメソッドで送信されます。このPostリクエストには、textareaのname属性を使用して指定されたパラメーターにフォーマットされたhtmlも含まれます。

したがって、テキストエリアが次のようなものである場合...

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

次に、送信ボタンを押した後、次の方法でサーブレット/コントローラーでフォーマットされたhtmlを取得できます。

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

また、フォーマットされたhtml（ 'htmlContent'）を含むこの変数をITEXT（または他のpdfコンバーター）に渡して、pdfを作成することもできます...

0
Amarjeet Singh