0

カスタム プラグインを使用して WYSYWIG に HTML を挿入する際に問題があります このテーマについてこれまでに見たインターネット上のすべてのリンクは、使用する必要があると述べています

FCK.InsertHtml();

しかし、これを使用すると、次の問題に直面しました: InsertHtml() の前の HTML コンテンツ:

<div>
<em>
<strong>
<font size="5">
<font face="Georgia">

123

</font>
</font>
</strong>
</em>
</div>

次に、文字「2」を選択し、FCK.InsertHtml(); を使用して html を挿入します。そして、次を取得します。

<div>
<em>
<strong>
<font size="5">
<font face="Georgia">

1

</font>
</font>
</strong>
</em>

<a class="subscribeNow" href="#ORDER_FORM_LINK#">2</a>

<em>
<strong>
<font size="5">
<font face="Georgia">

3

</font>
</font>
</strong>
</em>
</div>

ご覧のとおり、WYSYWIG はいくつかのタグを自動クローズし、その結果、モックアップが壊れています。これらの追加のソース操作なしで html を挿入する方法を知っている人はいますか?

4

1 に答える 1

0

まず第一に、FCKEditorはCKEditorの前身であり、そのサポートは数年前に廃止されました。私の答えはCKEditorでも有効ですが、FCKeditorでも有効かどうかはわかりません。

editor#insertHtmlこれは、ユーザーがコンテンツを貼り付けるときに頻繁に使用される方法です。これが主な機能です。現在のCKEditorバージョンでは、このメソッドはブラウザに実装されているネイティブHTML挿入アルゴリズムに基づいて機能します。したがって、実際、CKEditorの開発者である私たちは、これらのアルゴリズムについて多くのことを言うことはありません。変更することはできません。ただし、ブラウザ間の多くの違い(あまり気に入らない)を除いて、これらのアルゴリズムは動作が多かれ少なかれ正しいため、受け入れます。

なぜ正しいのですか?MSWordに太字のテキストがあるとしましょう。あなたはそれをコピーし、下線が引かれたテキストに貼り付けています。何が起こるのですか?貼り付けたテキストには下線が引かれておらず、太字になっているだけです。これは、MSWordが、コピーされたコンテンツのスタイルを保持することを想定しているためです。また、CKEditorはまったく同じように機能するようにインデントされています。

解決策は、editor#insertElementこれらの特別な操作なしでデータ(1つの要素)を挿入するメソッドを使用することです。より多くの要素を一度に挿入したい場合は、これをループで行う必要があります。

これは使用例です(エディターのコンテンツをに設定し、代わりにキャレットを配置した後、たとえばhttp://ckeditor.com/demoinsertElementでテストできます):<p><strong>te^xt</strong></p>^

var editor = CKEDITOR.instances.editor1,
    element = CKEDITOR.dom.element.createFromHtml( '<u>xxx</u>' );

editor.insertElement( element ); // result: <p><strong>te<u>xxx</u>xt</strong></p>
editor.insertHtml( '<i>yyy</i>' ); // result: <p><strong>te<u>xxx</u></strong><i>yyy</i><strong>xt</strong></p>

Chromeブラウザ以外でテストする場合は、結果が異なる場合があります。

PS。新しいCKEditorバージョンでは、この問題を認識しているため、スタイルを保持せずにコンテンツを挿入することが簡単になります。

于 2012-07-14T16:39:42.443 に答える