原文:https://www.jianshu.com/p/0f7984649347
TinyMCE是一個輕量、簡潔、功能強大的編輯器。
公司之前使用過kindEditor和wangEditor。
kindEditor：功能強大，代碼簡潔，有常用的從txt和word復制、多圖上傳等功能，但是沒有格式刷，運營的妹子經常反饋生成多余的空行，並且插入h5的video標簽默認也會被過濾掉，項目到2016年便不再維護了。
wangEditor：輕量、簡潔、易用，但是功能有限，沒有多圖上傳、格式刷等功能。
鑒於此，便換上了TinyMCE，原因有三：
- GitHub 上星星很多，一直在維護
- 從word粘貼和微信公眾上復制過來的文章基本能保持原格式
-
插件豐富，官網提供了很多實用的插件，如多圖上傳，首行縮進，字數限制等，還可以自定義插件，方便拓展
具體的使用中文網站已經講得很詳細啦。http://tinymce.ax-z.cn/quick-start.php
第1步：引入TinyMCE腳本
首先在官網下載自己需要的版本后，在<head>中插入如下這行代碼，將tinymce.min.js源文件引入項目。
<script src="你的網站路徑/tinymce/tinymce.min.js"></script> 第2步：將TinyMCE初始化為頁面的一部分
我們需要使用tinymce.init()來進行初始化。tinymce.init()內的初始化對象包含眾多參數，但都是可省略的，唯一必須的參數就是selector（允許通過css選擇器指定TinyMCE要綁定的內容容器，傳統模式需指定textarea，內聯或沉浸模式可指定div或其它塊元素，推薦div）
在下面這個例子中，我們創建一個TinyMCE實例初始化，來取代<textarea id='mytextarea'>
<!DOCTYPE html> <html> <head> <script src='tinymce.min.js'></script> <script> tinymce.init({ selector: '#mytextarea' }); </script> </head> <body> <h1>TinyMCE快速開始示例</h1> <form method="post"> <textarea id="mytextarea">Hello, World!</textarea> </form> </body> </html> 第3步：通過正常表單POST保存內容
當form提交時，TinyMCE會將內容塞進textarea，你可以通過正常的post方法獲取到編輯器中的內容，行為與普通textarea完全一致。
注意：使用第三方UI框架或采用ajax提交可能不會主動觸發內容同步，需要自己執行同步或自己獲取內容
1.如果當前頁面只有一個編輯器：
獲取內容：tinyMCE.activeEditor.getContent()
設置內容：tinyMCE.activeEditor.setContent(“需要設置的編輯器內容”)
2.如果當前頁面有多個編輯器（下面的“[0]”表示第一個編輯器，以此類推）：
獲取內容：tinyMCE.editors[0].getContent()
設置內容：tinyMCE.editors[0].setContent(“需要設置的編輯器內容”)
3.獲取不帶HTML標記的純文本內容：
var editBody = activeEditor.getBody();
activeEditor.selection.select(editBody);
var text = activeEditor.selection.getContent( { ‘format’ : ‘text’ } );
所以可以通過以下代碼將編輯器內容同步到textarea中：
var content=tinyMCE.activeEditor.getContent(); $("#mytextarea").val(content); 或者在初始化參數中setup參數里加入事件監聽，讓他自動同步。
setup: function(editor){ editor.on('change',function(){ editor.save(); }); }, 編輯器的回顯只需要給textarea賦值即可
<textarea id="mytextarea">${content}</textarea> 關於漢化：
1.在語言包（俗稱漢化包）下載頁，選擇可用的語言包下載到本地。
2.將語言包解壓，將js文件放入tinymce根目錄下的langs文件夾中（如不存在就自己新建一個），最后路徑形如：XXX/tinymce/langs/zh_CN.js
3.在TinyMCE實例配置參數中指定語言。
tinymce.init({ selector: '#mytextarea', language:'zh_CN',//注意大小寫 }); 漢化后的界面如下:
