tinymce 5 не загружает существующий контент в редактор, но код находится в представлении кода

Question

Я обновляю tinymce до версии 5.x и сталкиваюсь с некоторыми проблемами совместимости.В то время как 4.x работал, мне нужно было изменить несколько пользовательских кнопок, и все, и в основном все работает.Если я добавлю текст в редактор и нажму «Сохранить», он будет работать на одном наборе страниц.На другой странице я не могу передать текущее содержимое в редактор, но код показывает код.Если я затем вставлю этот код в тестовый сайт (новая установка tiny5) в представление кода и сохраню его, он отлично отобразится в редакторе.

Я использую

formJson['DESCRIPTION'] = $('iframe').contents().find('body').html();

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

и

$('.tox-edit-area').html($('iframe').contents().find('body').html()).show();

изнутри моей функции tinymceinit, которая показывает содержимое в редакторе, но они доступны только для чтения -или так кажется.

В консоли также не отображаются ошибки.

У кого-нибудь есть какие-нибудь жемчужины мудрости, которыми можно поделиться?Спасибо!

Обновление

// selector is passed into the function
var html = $(selector).html();//this is successful
tinymce.init({

    selector: selector,
    setup: function(editor) {
        editor.setMode('design');
        editor.setContent(html);//this does not load the code in design mode
        alert(html);// this alerts the expected code

    },


/// could any of this additional code below be causing an issue in tiny5?
    invalid_styles: {
        '*': 'font-size,font-family', // Global invalid styles
        'a': 'background' // Link specific invalid styles
    },
    valid_styles: {
        '*': 'border,font-size',
        'div': 'width,height'
    },
    font_formats: 'Arial=arial, helvetica, sans-serif;',
    toolbar: toolbtns,
    plugins: 'code table lists',
    //~ image_advtab: true,
    menubar: false,
    statusbar: false,
    //~ force_p_newlines : false,
    //~ force_br_newlines : true,
    //~ forced_root_block : '',
    width: '100%',
    height: '500px',
    relative_urls: false,
    content_css: "/include/css/bootstrap.css",
    images_dataimg_filter: function(img) {
        return img.hasAttribute('internal-blob');
    },
});

Что я делаю не так?: P

Answer 1

Вы используете один селектор для загрузки содержимого, а также в качестве целевого элемента для замены TinyMCE.Я не могу воспроизвести вашу ошибку, но в вашем случае setContent не требуется, и устранение может решить проблему.Вам не нужно вручную устанавливать контент, если целевой элемент содержит ваш контент;TinyMCE сделает это за вас.

Вот пример использования вашего кода с комментарием setContent:

http://fiddle.tinymce.com/QGgaab

Answer 2

Если вы пытаетесь загрузить контент в редактор, я бы сделал одно из следующих действий, следуя дизайну / API редактора.

1. Загрузите контент в <div> или <textarea> перед init() редактором.
2. Используйте API-интерфейс setContent() для загрузки данных в TinyMCE после инициализации TinyMCE.

Вы полагаетесь на базовыйHTML-структура, используемая редактором для взаимодействия с редактором и (как вы видели), которая не обязательно останется неизменной во времени.

Примечание: Если вы обновляете базовый элемент (<div> или <textarea>) после инициализации редактора, TinyMCE не увидит это обновление.Трудно сказать, является ли это частью вашей проблемы с контентом, не загружаемым в редактор, несмотря на то, что он существует в базовом <div> или <textarea>.

. Я бы также отметил, что TinyMCE имеетпараметр конфигурации режима только для чтения:

https://www.tiny.cloud/docs/api/tinymce/tinymce.editor/#setmode

..., который можно использовать для включения или отключения режима чтения только.