【问题标题】:CKEditor: Remove style properties from pasted contentCKEditor:从粘贴的内容中删除样式属性
【发布时间】:2014-05-21 13:59:26
【问题描述】:

我正在尝试找出一种将样式属性从粘贴的 HTML 内容中删除到 CKEditor 实例中的方法。我使用以下内容完全删除样式属性,但实际上我想保留 margin-left 属性。

CKEDITOR.on('instanceReady', function(ev) {
    ev.editor.on('paste', function(evt) {
        if (evt.data.type == 'html') {
            evt.data.dataValue = evt.data.dataValue.replace(/ style=".*?"/g, '');
         }
     }, null, null, 9);
});

问题是,有时margin-left 只是切换到margin 速记并且我不想要的额外数据被添加到其中。

我正在研究 jQuery 和 Javascript 方法来尝试实现这一点,但我还没有取得任何成功。

【问题讨论】:

    标签: javascript jquery html ckeditor


    【解决方案1】:

    您可以将正确配置的允许内容过滤器应用于粘贴的数据。请参阅此答案以了解如何将其应用于字符串:Apply CKEditor Advanced Content Filter to a string

    您可能遇到的唯一问题是您不能告诉 ACF 允许所有元素及其属性,您必须指定元素。所以过滤器可能看起来像这样:

    var filter = new CKEDITOR.filter(
        'p h1 h2 h3 img strong em ul ol li[*](*){margin-left}'
    );
    

    它将允许所有属性和类,但这些元素上只允许margin-left


    编辑

    有一种简单的方法可以列出所有元素:

    var filter = new CKEDITOR.filter( {
        '$1': {
            // Use the hash containing all correct HTML elements
            // (plus some more things, but we can ignore them in this case).
            elements: CKEDITOR.dtd,
            attributes: true,
            classes: true,
            styles: 'margin-left'
        }
    } );
    

    【讨论】:

    • 这仅适用于粘贴的内容吗?一旦它在编辑器中,可能会有其他样式应用于内容。我只是想在粘贴之前将其过滤掉。
    • 我刚刚展示了如何将独立过滤器应用于 HTML 字符串。如果你在粘贴事件监听器中这样做,那只会影响粘贴的内容。
    • 这很好用,但我想出了一个 jQuery 解决方案来代替。当内容被粘贴时,margin-left 永远不会被设置。它使用边距:x x x x 简写。我只需要那里的左值,但 CKEDITOR 过滤器会一起拉出边距。
    • 是的...这是一个已知的限制。而且我也即将遇到它,所以希望我能够一劳永逸地解决它。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-09-08
    • 1970-01-01
    • 2013-07-01
    • 2013-08-23
    • 1970-01-01
    相关资源
    最近更新 更多