2

<img> のように選択、切り取り、貼り付け、ドラッグできる編集不可能な要素を TinyMCE に入れたいのですが、その内容は編集できません。

Chrome で <div contenteditable="false"> を試してみました。編集できません。ただし、選択もドラッグもできません。

contenteditable 領域で、複合要素 (<div> など) を文字や画像のようにアトミックにする方法はありますか?

4

2 に答える 2

0

input[type="button"]これらはリージョン内でも編集できないため、1 つのトリックは を使用することcontenteditableです。

<textarea>
    <p>This is editible content.</p>
    <input value="This is uneditable content." type="button" draggable="true" style="border: 0; background: transparent; padding: 0; margin: 0; font-family: inherit" />
</textarea>

<script>
    tinyMCE.init({ mode: 'textareas' });
</script>

TinyMCE フィドル

入力は子要素を持つことができないため、完全ではありません。

動的な HTML を表示する必要がある場合は、( html2canvasinput[type="button"]または同等のものを使用して) HTML をキャンバス要素にレンダリングし、キャンバスでの呼び出しから取得した文字列に背景画像を設定できgetDataURLます。(また、レンダリングされた HTML の高さと幅を計算し、高input[type="button"]さと幅が一致するように設定する必要があります。)

于 2013-11-15T07:16:41.543 に答える