0

以下のコンテンツをデフォルトとして ckeditor を開いています。

<textarea id="editor1" name="editor1" rows="30" cols="120"><p>We can use&nbsp;<strong>prettify&nbsp;</strong>to auto-format the Computer programming code at web page.</p>

<p><strong>How to use?</strong></p>

<p>Just add below line;</p>

<p><code class="prettyprint"><span style="line-height: 1.6em;">&lt;script src=&quot;https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js&quot;&gt;&lt;/script&gt;</span></code</p>

<p><span style="line-height: 1.6em;">Then, put the code line in below tab;</span></p>

<p><code class="prettyprint">&lt;code class=&quot;prettyprint&quot;&gt;...&lt;/code&gt;</code></p>

<p><span style="color: rgb(0, 0, 0); font-family: monospace; font-size: medium; line-height: normal;">or,</span></p>

<p>Download the complete code files&nbsp;from&nbsp;<a href="https://code.google.com/p/google-code-prettify/">https://code.google.com/p/google-code-prettify/</a>(even can learn more about prettify)&nbsp;&nbsp;to your server and change above script tag line like below;</p>

<p><code class="prettyprint">&lt;script src=&quot;path/to/directory/run_prettify.js&quot;&gt;&lt;/script&gt;</code><br />&nbsp;</p>
</textarea>
<script>CKEDITOR.replace( "editor1");</script>

ただし、出力の HTML タグ コードが欠落しています。出力は以下 (下線) です。

prettify を使用して、Web ページのコンピューター プログラミング コードを自動フォーマットできます。

使い方？

以下の行を追加するだけです。

次に、コード行を下のタブに配置します。

...

また、

完全なコード ファイルをhttps://code.google.com/p/google-code-prettify/からサーバーにダウンロードし (prettify の詳細も参照できます)、上記のスクリプト タグ行を次のように変更します。

期待される出力: 期待される出力 助けてください。

4

1 に答える 1

0

これは、この質問の別の同様の問題のように見えます: How to prevent CKEditor from stripping < and > (greater-than/less-than)

回避策は、setData を使用して値を設定することです。以下は、4.1 サンプルで動作するようになったテストです。

<textarea id="editor1">
    <p>foo</p>
</textarea>
<script>
    var txt = '<p>We can use&nbsp;<strong>prettify&nbsp;</strong>to auto-format the Computer programming code at web page.</p><p><strong>How to use?</strong></p><p>Just add below line;</p><p><code class="prettyprint"><span style="line-height: 1.6em;">&lt;script src=&quot;https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js&quot;&gt;&lt;/script&gt;</span></code</p><p><span style="line-height: 1.6em;">Then, put the code line in below tab;</span></p><p><code class="prettyprint">&lt;code class=&quot;prettyprint&quot;&gt;...&lt;/code&gt;</code></p><p><span style="color: rgb(0, 0, 0); font-family: monospace; font-size: medium; line-height: normal;">or,</span></p><p>Download the complete code files&nbsp;from&nbsp;<a href="https://code.google.com/p/google-code-prettify/">https://code.google.com/p/google-code-prettify/</a>(even can learn more about prettify)&nbsp;&nbsp;to your server and change above script tag line like below;</p><p><code class="prettyprint">&lt;script src=&quot;path/to/directory/run_prettify.js&quot;&gt;&lt;/script&gt;</code><br />&nbsp;</p>'
    CKEDITOR.on('instanceReady', function(ev) {
        ev.editor.setData(txt);
    });
    CKEDITOR.replace( 'editor1', { allowedContent: 'p' } );
</script>
于 2013-04-23T06:39:48.690 に答える