Javascript 在输入新段落时防止复制属性？

在CKEditor中创建新段落时，会将上一段落的属性（样式、类）复制到新段落上。有没有办法防止这种情况

例如，如果我在一个居中段落中写作并按enter键创建一个新段落，我的用户希望新段落是一个简单的，默认情况下不会“继承”上一个段落的任何内容

---

编辑

我设法让它（危险的未经测试）与莱因玛的提示工作。这就是我的结局；我希望这对其他人有帮助。如果你们看到了一个明显的错误，请告诉我

CKEDITOR.on('instanceCreated', function(e) {
    e.editor.on('key', function(evt) {
        if (evt.data.keyCode === 13) {
            // if we call getStartElement too soon, we get the wrong element
            setTimeout(function () {
                var se = e.editor.getSelection().getStartElement();
                if(se.getName() == "span") {
                    var text = se.getText(); // Store text, we are about to nuke the spans
                    while (se.getName() == "span") { // possible infinite loop danger
                        se = se.getParent();
                    }
                    if (text.length == 0)
                        se.setHtml(" "); // It's important that this is not empty
                    else
                        se.setHtml(text);
                }
                debug(se.getHtml());
                se.removeAttribute("class");
                se.removeAttribute("mycustomattr");
                se.removeAttribute("myothercustomattr");
                window.bla = se; // useful for debugging
            }, 10);
        }
    });
}); 

---

过去两天我一直在考虑你的问题，我有了一个想法。我选中了“输入插件代码”，最好保持原样。相反，您可以按enter键进行监听，在执行自定义enter后，您应该从新创建的块中清除样式

这些方法将非常有用：

• editor.on（'key'，function（evt）{evt.data.key…}）

• editor.getSelection（）.getStartElement（）

  -输入后，选择开始将放置在新创建的块中（+粗体、下划线等内联元素）

• CKEDITOR.dtd.*

  -元素集可以帮助您决定哪些元素是内联样式，应该删除哪些元素

• element.isEmptyInlineRemoveable

  -应该删除放置光标的空内联元素

• editor.createRange（）.setStartAt（块，0）。选择（）

  -在末尾，您应该将插入符号放在正确的位置（在块的开头-
  /

  /etc）
  
  

---

不幸的是，正如您所看到的，这不是一件容易写的事情，所以祝您好运：）

我对即将推出的CKEditor v4（当前的夜间新闻）也有类似的问题。我从我的自定义图像浏览器中插入了一个包含图像和自定义类的段落，而CKEditor一直将这些类复制到图像后创建的段落中

我不喜欢

key

事件之后再调用

setTimeout

，所以我稍微检查了一下源代码，结果证明它非常简单

按enter键时，CKEditor实际上发出

enter

命令。您只需设置一个

afterCommandExec

事件并查找新创建的空元素：

editor.on('afterCommandExec', function (e) {
    if (e.data.name == 'enter') {
        var el = e.editor.getSelection().getStartElement();

        // when splitting a paragrah before it's first character,
        // the second one is selected
        if (el.getHtml() != '<br>') {
            if (el.hasPrevious() && el.getPrevious().getHtml() == '<br>') {
                el = el.getPrevious();
            } else {
                // both paragraphs are non-empty, do nothing
                return;
            }
        }

        // modify el according to your needs
    }
});

editor.on（'afterCommandExec'，函数（e）{
如果（e.data.name=='enter'）{
var el=e.editor.getSelection（）.getStartElement（）；
//在第一个角色之前分割一个巴拉圭时，
//选择第二个
如果（el.getHtml（）！=“
”）{
如果（el.hasPrevious（）&&el.getPrevious（）.getHtml（）=='
'）{
el=el.getPrevious（）；
}否则{
//两段都不是空的，什么也不做
返回；
}
}
//根据您的需要修改el
}
});

---

希望这有帮助

这是一篇老文章，但我也遇到了同样的问题，我终于找到了一些可行的方法，所以我想分享我的解决方案。对于那些不知道我们为什么需要此功能的人，我的解释如下：

默认情况下，当按enter键插入新行时，CKEDITOR尝试允许用户继续使用相同的样式。换句话说，如果文本粗体居中，并且按enter键，则ckeditor将复制该样式，以便新行也粗体居中。这非常好，除非您想插入更复杂的东西，比如带有属性的嵌套元素（比如通过插件）。当您在具有类的元素中单击enter键时，ckeditor将使用相同的类创建一个新的段落元素，如果该类依赖于父元素的存在，则该元素将不起作用（以下是一个示例，其中会出现问题：）

我提出的解决方案结合了Reinmar和Nenotlep的代码和建议：

// create object of safe classes
var safe_classes = {};
$.each(ckeditor_styles_full, function(i, style) {
    if(style['attributes']) {
        var style_classes = style['attributes'].class;
        var style_element = style['element'];

        if(typeof safe_classes[style_element] != "object") {
            safe_classes[style_element] = [];
        }

        style_classes = style_classes.split(" ");
        $.each(style_classes, function(i, v) {
            if($.inArray(v, safe_classes[style_element]) <= -1) {
                safe_classes[style_element].push(v);
            }
        });
    }
});

$.each(CKEDITOR.instances, function(i, editor) {
    editor.on('key', function(e) {
        if (e.data.keyCode === 13) {
            setTimeout(function () {
                var se = e.editor.getSelection().getStartElement();
                var parent = se.getParent().getName();
                if(parent == "html" || parent == "body") {
                    var se_classes = se.getAttribute('class');
                    var new_classes = [];
                    se.removeAttribute("class");

                    if(se_classes !== null) {
                        se_classes = se_classes.split(" ");
                        $.each(se_classes, function(i, v) {
                            if(typeof safe_classes[se.getName()] != 'undefined') {
                                if($.inArray(v, safe_classes[se.getName()]) > -1) {
                                    se.addClass(v);
                                }
                            }
                        });
                    }
                }
            }, 10);
        }
    });
});

//创建安全类的对象
var-safe_-classes={}；
$。每个（ckeditor\u样式\u完整，功能（i，样式）{
if（样式['attributes']）{
var style_classes=style['attributes'].class；
var style_element=style['element']；
if（安全类的类型[样式元素]！=“对象”）{
安全类[样式元素]=[]；
}
style_classes=style_classes.split（“”）；
$。每个（样式、类、函数（i、v）{
if（$.inArray（v，安全类[样式元素]）-1）{
se.addClass（v）；
}
}
});
}
}
}, 10);
}
});
});

它的工作原理如下：首先，脚本从“选定样式”列表中提取类名，并按元素类型将它们编译成对象。然后，它迭代将事件绑定到enter键的CKEDITOR的所有实例。接下来，它检查在按下enter键时创建的元素是否位于HTML或BODY之外的父元素内（即，它是较大元素树的一部分）。最后，如果它不在容器元素内，它将从该元素中剥离所有不在先前创建的“safe_classes”对象中的类

2个重要的旁注： 1） 您仍然需要设置“forceEnterMode:true” 2） 因为“forceEnterMode”设置为true，所以最好只嵌套段落元素。例如：

<div class="container"><p class="title">Title Text</p><p class="content">Content Goes Here</p></div>

标题文本

---

否则，如果在嵌套的div中按enter键，则ckeditor会将该div的所有属性复制到一个段落元素中。

我将尝试使用此方法，在没有可用于此功能的配置选项时，这是一种巧妙的解决问题的方法！一旦我有什么事要做，我就回来报告。我们可能会考虑为此添加配置选项，但我还没有弄清楚argum