通过 ckeditor 添加的表不保留样式属性



我已经将ckeditor集成到一个网页中,该网页使用表格插件允许用户在编辑器窗口中创建表格。当用户退出编辑器窗口并且结果显示在页面上时,表格宽度有时会比网页宽得多。

我进行了更改,以便编辑器允许样式标签,例如:

CKEDITOR.replace('editor', {
    extraAllowedContent: 'table{*}'
});

还对 ckeditor 的配置进行了此更改.js以使表格的默认宽度为 100%:

CKEDITOR.on('dialogDefinition', function (ev) {
    var dialogName = ev.data.name;
    var dialogDefinition = ev.data.definition;
    if (dialogName == 'table') {
        var info = dialogDefinition.getContents('info');
        info.get('txtWidth')['default'] = '100%';  
    }
});

但是我无法将表格布局设置为固定,以便当表格显示在网页上时,表格在网页上的宽度固定为 100%。

如果表在从 CKEditor 中提取数据时具有width:100%(您可以通过 editor.getData 方法验证它(,则其宽度取决于它在网站上放置的父元素宽度。如果父元素(直接或非(具有固定宽度,则表不应超出该宽度。

请参阅此代码笔:https://codepen.io/f1ames/pen/ZaaRPy

如果上面的答案还不够,也许您可以分享您的 html 代码或准备一些显示问题的片段?

最新更新