0

TinyMCE ( documentation ) とCKEditorを試しましたが、どちらも初期化にこの種のコードが必要です:

tinyMCE.init({
    selector: '.some-div-with-text-inside',
    inline: true,
    fixed_toolbar_container: '.toolbar',
    valid_elements: '*[*]',
    setup: function(editor) {
            // something that happens on setup
    }
});

したがって、基本的に何らかのセレクターが必要であり、.some-div-with-text-insideクラスを持つすべての DIV が TinyMCE の編集可能領域になります。エディタが.toolbarコンテナに表示されます。

==========================

私が理想的に実現したいのは、どの DIV または TEXTAREA にも関連付けられておらず、その機能 (「太字テキスト」、「リンクの作成」など) がドキュメント内のコンテンツ編集可能領域で機能するエディターです。いくつかの選択が行われました。Rangy を使用すると、まさにこれが可能になります。デモを見る: http://rangy.googlecode.com/svn/trunk/demos/cssclassapplier.html

TinyMCE v3 では、次のようなものが利用可能でした:

$(function(){
            tinyMCE.init({ mode: "none", theme: "simple" });
            tinymce.execCommand("mceAddControl", false, "myEditableDIV");
});

しかしmode: "none"、v4 には存在しなくなり、2 行目はtinyMCE.execCommand("mceAddEditor", false, "myEditableDIV");現在になりましたが、この方法で複数の編集可能な DIV が追加された場合、エディターは 内に複数回表示.toolbarされます。それを防ぐ方法はないか考え中です。

現在および将来のすべてのDIVに対して 1 つのエディターが必要contenteditableです。一部の DIV は、ドキュメントに追加または削除される場合があります。ドキュメントのすべてのオプションを調べましたが、機能させることができませんでした。

4

1 に答える 1