Установить значение textarea с помощью javascript после инициализации TinyMCE

У меня есть текстовое поле, и я использую tinyMCE в этом текстовом поле.

То, что я делаю на самом деле, это то, что когда страница открыта, я заполняю текстовую область каким-то текстом, а после этого я инициализирую tinyMCE.

Проблема заключается в том, что когда я пытаюсь изменить значение textarea после инициализации tinyMCE, ничего не происходит.

Вот пример.

  • Создание текстового поля:

    <textarea style="width: 95%;" name="title"  id="title"></textarea>
    
  • Заполнение текстового поля:

    $('#title').html("someText");
    
  • Инициализация tinyMCE

    tinyMCE.init({
            // General options
            mode : "specific_textareas",
            theme : "advanced",
            width: "100%",
            plugins : "pagebreak,paste,fullscreen,visualchars",
    
            // Theme options
            theme_advanced_buttons1 : "code,|,bold,italic,underline,|,sub,sup,|,charmap,|,fullscreen,|,bullist,numlist,|,pasteword",
            theme_advanced_buttons2 :"",
            theme_advanced_buttons3 :"",
            theme_advanced_buttons4 :"",
            theme_advanced_toolbar_location : "top",
            theme_advanced_toolbar_align : "left",
            theme_advanced_statusbar_location : "bottom",
            valid_elements : "i,sub,sup",
            invalid_elements : "p, script",
            editor_deselector : "mceOthers"
        });
    
  • Я хотел бы изменить содержимое текстового представления (но он не работает)

Я попытался использовать то же самое, что и до init tinyMCE

    $('#title').html("someModifiedText"); // does not work

Я также попытался удалить tinyMCE:

    if(tinyMCE.getInstanceById('title'))
    removeTinyMCE("title");

С

function removeTinyMCE (dialogName) {
    tinyMCE.execCommand('mceFocus', false, dialogName);
    tinyMCE.execCommand('mceRemoveControl', false, dialogName);

}

И повторное использование:

    $('#title').html("someModifiedText"); // does not work

У меня нет идей... Большое спасибо за вашу помощь....

Ответы

Ответ 1

Проблема здесь в том, что вы ничего не увидите, если введете текст или html в текстовое поле. Ваша текстовая область будет скрыта при инициализации tinymce. Затем вы видите редактируемый контент iframe, который используется для редактирования и стилизации контента. Есть несколько событий, которые заставят tinymce записать свой контент в элемент исходного кода html редактора (в вашем случае это textarea).

Если вы хотите установить содержимое редактора (которое видно), вам нужно вызвать что-то вроде

tinymce.get('title').setContent('<p>This is my new content!</p>');

Вы также можете получить доступ к элементам DOM напрямую, используя следующие

tinymce.get('title').getBody().innerHTML = '<p>This is my new content!</p>';

или используя jQuery

$(tinymce.get('title').getBody()).html('<p>This is my new content!</p>');

Ответ 3

Просто это работает для меня

$("#description").val(content);

Ответ 4

Это работает для меня. Просто поместите его в свой HTML-код вместо перехода tinymce

    <textarea> html CONTENT</textarea>