2017-06-01 95 views
1

我試圖動態地改變TinyMCE的編輯器的內容。 連這個步驟是行不通的。其實我想把內容放在阿賈克斯成功,但因爲它不工作,我不能繼續。如何設置TinyMCE的內容動態

我得到錯誤類型tinemce.get()爲空和tinymce.activeEditor是零誤差修改

<textarea style="height:700px" name="proposal" id="proposal" > 
         hi 
</textarea> 
<script> 
    $(document).ready(function() { 
         tinymce.init({ 
          selector: "#proposal", 
          height: 250, 
          theme: "modern", 
          plugins: [ 
          "autoresize advlist autolink lists link image charmap print preview hr anchor pagebreak", 
          "searchreplace wordcount visualblocks visualchars code fullscreen", 
          "insertdatetime media nonbreaking save table contextmenu directionality", 
          "emoticons template paste textcolor colorpicker textpattern imagetools codesample toc" 
          ], 
          toolbar1: "undo redo | insert | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | print preview media | forecolor backcolor emoticons | codesample", 
          image_advtab: true, 
          content_css: [ 
          "https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css", 
          ], 


         }); 
         var content = "<p>Hello World </p>"; 
         tinyMCE.get("proposal").setContent(content);//not working 
         tinyMCE.activeEditor.setContent(content);//not working 

        }); 

<script>  

回答

0

您的通話tinyMCE.get("proposal")和前編輯實際實例tinyMCE.activeEditor都有可能發生。 TinyMCE的init()方法需要時間來完成,但你這兩種方法直接調用init()這樣編輯器很可能尚未初始化之後。

編輯器有一個init事件您可以用它來知道什麼時候該編輯器完全初始化,然後你可以使用編輯器的API。你可以把這樣的事情在你的TinyMCE的配置:

tinymce.init({ 
    selector: "#proposal", 
    ... 
    setup: function (editor) { 
     editor.on('init', function() { 
      var content = "<p>Hello World </p>"; 
      editor.setContent(content); 
     }); 
    } 
}); 
+0

謝謝你....答案是接近。但它會在init之外工作嗎?正如我在我的問題提到的,我想用它在阿賈克斯成功 –

+0

事實上你可以 - 只要知道,你不能調用任何TinyMCE的的API,直到編輯器完全加載。你的例子不顯示任何AJAX調用,所以我的答案是針對你的例子定製的。您可以使用'init'觸發AJAX調用來獲取數據,也可以通過其他方式獲取數據 - 只要確保編輯器初始化您嘗試使用其API之前。 –

0

在TinyMCE的4,你可以嘗試一下:

// Sets the HTML contents of the activeEditor editor 
tinymce.activeEditor.setContent('<span>some</span> html'); 

// Sets the raw contents of the activeEditor editor 
tinymce.activeEditor.setContent('<span>some</span> html', {format: 'raw'}); 

// Sets the content of a specific editor (my_editor in this example) 
tinymce.get('my_editor').setContent(data); 

// Sets the bbcode contents of the activeEditor editor if the bbcode plugin was added 
tinymce.activeEditor.setContent('[b]some[/b] html', {format: 'bbcode'}); 

更多通過Tinymce

相關問題