在TinyMCE初始化之后用javascript设置textarea值

Question

我有一个textarea,我在那个textarea上使用tinyMCE.

我实际上在做的是,当页面打开时,我用一些文本填充textarea,然后我正在初始化tinyMCE.

问题是当我试图在tinyMCE初始化之后改变textarea的值时,没有任何反应.

这是一个例子.

1. 创建textarea:

   <textarea style="width: 95%;" name="title"  id="title"></textarea>
   

2. 填充textarea:

   $('#title').html("someText");
   

3. 初始化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"
       });
   

4. 我想更改textview的内容(但它不起作用)

我尝试使用与初始化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

我没有想法......非常感谢你的帮助....

Answer 1

这里的问题是,如果您在textarea中输入text或html,则不会看到任何内容.当tinymce初始化时,你的textarea会被隐藏.您所看到的是内容可编辑的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>');

Answer 2

你可以使用 tinyMCE.activeEditor.setContent('<span>some</span> html');

检查此答案