Question

我们正尝试使用CKEditor清除输入，以将其发送到仅支持特定html标签（div，span，ol，ul，li）以及这些标签上的style属性的第三方报告包。出于本文的目的，我通过为所有.coreStyles_ *指定跨度样式和为所有.format_ *设置指定div来接近最终解决方案。
用例是用户将从其他位置复制并粘贴到CKEditor中进行编辑，或者直接在CKEDITOR中进行编辑或将二者结合使用。编辑完成后，将复制并粘贴到其他系统中。不理想，但这是我们目前必须使用的。

关于br标签以及一些div和p标签，我遇到了麻烦。

这是我想要实现的目标（尽管我愿意接受其他建议）：

br, replace with <div style="clear: both"></div>
p  = config.format_p = {
      element: 'div',
      styles: {
          'display': 'block',
          'margin-top': '1em',
          'margin-bottom': '1em',
          'margin-left': '0',
          'margin-right': '0'
     }
 };
div = <div style="\1"> where \1 is whatever the existing style is from the copy/paste operation.

这是我目前的状况和挑战：

CKEDITOR.config.enterMode = CKEDITOR.ENTER_P即可正确转换为.format_p。挑战是用户必须选择“正常”，而我无法确定如何将格式默认为该格式。我试图避免使用CKEditor团队建议的CKEDITOR.ENTER_DIV。
CKEDITOR.config.enterShiftMode似乎没有响应。可能不受支持，但可能需要执行另一轮缓存清除周期才能确认。
标准Div标签似乎正转换为div标签之前设置的div样式。例如，如果这是代码
一些文字

在编辑器中，用户按下Enter键，然后重复具有样式（而不是文本）的div标签。但是，如果是这样的话：

 <div style="text-align: center;">test text</div>

然后

 <div style="text-align: center;"> </div>

重复

，而不是我为format_p指定的代码。

那么，有什么可能的解决方案：

我应该考虑创建一个处理该插件的插件吗？
或者我可以利用某些组合的配置设置来实现这一目标？

感谢您的协助！

支持代码段。我可以添加更多，但是已经很长了。让我知道！（来自html文件）。

<div id="editToolBar" style="mar"></div>
    <div id="editor1"  contenteditable="true" style="height:500px;"><p>Testing</p></div>
    <script>
        CKEDITOR.config.removePlugins = 'magicline,maximize,resize,floatingspace,sourcearea,stylescombo,tableselection,tabletools,table';
        CKEDITOR.config.extraPlugins = 'sharedspace,sourcedialog';
        CKEDITOR.config.enterMode = CKEDITOR.ENTER_P;
        CKEDITOR.config.shiftEnterMode = CKEDITOR.ENTER_BR;
    </script>

config.js中的样本

config.toolbarGroups = [
    { name: 'document', groups: ['< >', '-', 'mode', 'document', 'doctools'] },
    { name: 'clipboard', groups: [ 'clipboard', 'undo' ] },
    { name: 'editing', groups: [ 'find', 'selection', 'editing' ] },
    { name: 'forms', groups: [ 'forms' ] },
    '/',
    { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
    { name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi', 'paragraph' ] },
    { name: 'links', groups: [ 'links' ] },
    { name: 'insert', groups: [ 'insert' ] },
    '/',
    { name: 'styles', groups: [ 'styles' ] },
    { name: 'colors', groups: [ 'colors' ] }
];

var htmlElement = document.getElementById('editToolBar');
config.sharedSpaces = {
    top: htmlElement
};

config.removeButtons = 'Templates,CreateDiv,Blockquote,Language,Link,Unlink,Anchor,PageBreak,Flash';

config.coreStyles_bold = {
    element: 'span',
    styles: { 'font-weight': 'bold' }
};

config.format_p = {
    element: 'div',
    styles: {
        'display': 'block',
        'margin-top': '1em',
        'margin-bottom': '1em',
        'margin-left': '0',
        'margin-right': '0'
    }
};

config.format_h1 = {
    element: 'div',
    styles: {
        'display': 'block',
        'font-size': '2em',
        'margin-top': '0.67em',
        'margin-bottom': '0.67em',
        'margin-left': '0',
        'margin-right': '0',
        'font-weight': 'bold'
    }
};

CKEDITOR将p / br标签转换为div

0 个答案: