Переключатели режима просмотра Tinymce после инициализации

Мой редактор - tinymce4 +. В большинстве случаев он работает очень сильно.Переключатели режима просмотра Tinymce после инициализации

Но независимо от того, что я делаю, есть что-то, чего я просто не могу сделать. - режим переключения редактора мгновенно. -

У меня есть страница, где пользователи могут выбирать данные, редактировать их и просматривать содержимое. Пользователи нажимают на кнопку с именем «viewmode», другой - «editmode»

Я достиг этого, поставив два DIV с в один и тот же контейнер, делая один из них невидимым для пользователей, которые выбирают параметры поиска. Один DIV имеет редактор tinymce, тег iframe, а другой имеет только кучу html-значений, которые хранит редактор. Но побочным эффектом этого является то, что стиль контента может выглядеть по-другому, в зависимости от его атрибутов стиля.

Это веб-приложение, о котором я говорю сейчас, представляет собой существующую систему, которая имеет свои собственные CSS. Это настолько сложно, что как только вы увидите его, вы можете убежать от него.

Я так же хотел бы избежать этого несоответствия CSS, сделав редактор динамически переключаемым в обоих направлениях.

Загрузка нескольких объектов tinymce - это последнее, что мне нужно здесь.

я могу сделать редактор отключить, установив атрибут - contenteditable = false - Но тогда элементы панели инструментов становятся плохие парни здесь. потому что они все еще работают. Я скрываю панель инструментов для завершения этой миссии.

Но вы знаете, мой клиент ненавидел его и настаивал на том, что редактор должен предоставить кнопку печати в своем режиме просмотра. Это расстраивает.

Итак, если бы вы могли просто дать мне представление о том, как манипулировать элементами панели инструментов, то я думаю, что мне удастся решить эту проблему.

Если это слишком сложно, добавление прослушивателя событий печати к внешнему элементу также может быть вторым лучшим вариантом для меня. Поскольку с этого момента я просто отбрасываю панель инструментов и делаю значок печати в верхней части редактора и присоединяю к нему событие.

Извините, что набрал все простые тексты. Но вопрос вроде этого не требует кодов, которые я думаю. Надеюсь, что какой-то тинумский гуру остановится и поможет мне.

источник

2014-07-31 hina10531

Наконец, я сделал свой редактор доступным.

Первый шаг - скрыть все элементы на панели инструментов tinyMCE.

tinyMCE панели инструментов имеют определенное имя класса, поэтому их можно выбрать с помощью селектора классов jQuery. Но выбор с помощью только имени класса вызывает появление нежелательных панелей инструментов, поэтому вы должны быть осторожны с этим.

FYI .eq() API может вам помочь.

после скрытия всех элементов на панели инструментов (не скрывайте панель инструментов, кстати.) Сделайте это.

tinymce.ui.Factory.create({ 
    type: 'button', 
    cmd: 'mcePrint', 
    icon: 'print', 
    shortcut: 'Ctrl+P', 
    class : 'temp' 
}).renderTo(appendTarget);

Это добавит элемент кнопки в панель инструментов.

Но почему-то это не вызывает команду, определенную в значении cmd.

Так что это событие на кнопку вручную будет необходимо.

tinymce.activeEditor.execCommand('mcePrint');

До сих пор я создал специальную панель инструментов для редактора режима просмотра. Теперь пришло время заморозить поле фактического содержимого edior.

Это очень легко после получения содержимого iframe как объекта jQuery.

.contents() API должен помочь вам.

После этого вы можете выбрать элемент <BODY> на вашей стороне, так что последнее, что осталось сделать, - дать атрибут contenteditable = false и значение тегу body.

Затем ваш редактор замерзает.

Возвращение в режим редактирования также очень просто. Просто делай назад.

Вызовите эти события, когда вы нажмете на свою кнопку «переключатель». Затем вы можете переключить ваш редактор из режима просмотра в режим редактирования (и также oppsite).

источник

2014-08-01 06:20:02 hina10531

Переключатели режима просмотра Tinymce после инициализации

ответ

Смежные вопросы