在代码中粘贴时停止TinyMCE剥离缩进

lee*_*n3o 5 tinymce rich-text-editor tinymce-4

我正在使用最新的TinyMCE,这很棒,但我唯一的问题是当人们发布代码示例时.如果他们以PRE格式或正常情况发布它并不重要.

TinyMCE删除所有缩进(Tabs)并使其难以阅读,有没有人在这里设法绕过这个?代码示例/示例将不胜感激.

Pal*_*555 2

这就是你的追求吗?它似乎在这个JSFiddle上正常工作

超文本标记语言

<form>
    <textarea id='editor_instance_1'></textarea>
</form>
<button id='post-code-btn'>Post Code</button>
<div id='post-area'></div>
Run Code Online (Sandbox Code Playgroud)

JS

//create instance of an mce editor
var ed = new tinymce.Editor('editor_instance_1', {
    //add custom formats
    style_formats: [
      {title: 'Code', block: 'pre', styles: {'color': '#000', 'font-size':  '11px'}},
      {title: 'Text', block: 'p', styles: {'color': '#ff0000', 'font-size': '16px'}}
    ],
    //force the starting block to pre
    forced_root_block : 'pre'    
}, tinymce.EditorManager);

//render the editor on screen
ed.render();

var postButton = document.getElementById('post-code-btn');
var postArea = document.getElementById('post-area');

postButton.onclick = function(){
    //get html structure from the editor instance
    var code = ed.getBody().innerHTML;
    //simulate posting of html
    new Request.HTML({
        url: '/echo/html/',
        data: {
           html: code,
           delay: 0
         },
         type: 'post',
         update: 'post-area',    
    }).send();
}
Run Code Online (Sandbox Code Playgroud)

我粘贴了来自多个来源的代码,包括 eclipse、SO 和 JSFiddle。