TinyMCE - может у него нет редактируемых областей?

Я попробовал 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
    }
});

Таким образом, в основном требуется какой-то селектор, и все DIV с классом .some-div-with-text-inside станут редактируемыми областями 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, и вторая строка теперь стала tinyMCE.execCommand("mceAddEditor", false, "myEditableDIV");, но когда таким образом добавлено несколько редактируемых DIV, редактор появляется несколько раз внутри .toolbar. Мне интересно, есть ли способ предотвратить это?

Мне просто нужен 1 редактор для всех текущих и будущих DIV с contenteditable. Некоторые DIV могут быть добавлены или удалены из документа. Я просмотрел каждый вариант в их документации, и я не мог заставить его работать.


javascript tinymce tinymce-4
person Atadj    schedule 09.10.2013    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Я думаю, что вы не можете редактировать DIV или Textarea без прикрепления tinyMCE, но вот один трюк, который вы можете сделать - вы можете СКРЫТЬ панели инструментов редактора и показывать их только тогда, когда вы сосредоточены текущий DIV или текстовое поле. Для этого вы можете использовать эту функцию:

editor.on('focus', function(e) {
        and here show the toolbars
    });
person cyrat    schedule 09.10.2013