有时用户将文本从不同来源复制并粘贴到 CKEditor，但我想限制他们可以复制到 CKEditor 的标签。
我只需要在CKEditor中使用某些标签：列表标签、中断标签等...
我可以在 CKEditor 中定义它们并禁用其他标签吗？
【问题讨论】：
标签： ckeditor
您可以使用一些设置。您可以在 ckeditor 的根目录中编辑 config.js 文件来定义这些设置。例如，如果你想像我一样激进，你可以说：
config.forcePasteAsPlainText = true;
如果你只想像你说的那样限制某些标签，我找到了下面的设置：
config.removeFormatTags = 'b,big,code,del,dfn,em,font,i,ins,kbd';
只有在用户执行“删除格式”命令时才会完成最后一项。 更多信息：http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.format_tags
考虑到一直以来，我认为您已经找到了答案，但可以帮助其他人。
【讨论】：
我这样做只是为了确保没有人可以在编辑器中添加<input> 标签。它可能会扩展到其他标签：
CKEDITOR.on('instanceReady', function(ev)
{
var editor = ev.editor;
var dataProcessor = editor.dataProcessor;
var htmlFilter = dataProcessor && dataProcessor.htmlFilter;
htmlFilter.addRules(
{
elements :
{
input: function(element)
{
return false;
},
}
});
});
我使用 phpjs.org 中的 strip_tags 方法将有限的 html 标签选择直接应用于粘贴操作。
CKEDITOR.on('instanceReady', function(ev) {
ev.editor.on('paste', function(evt) {
evt.data['html'] = strip_tags(evt.data['html'],
'<i><em><b><strong><blockquote><p><br><div><ul><li><ol>' // allowed list
);
});
});
function strip_tags (input, allowed) {
// http://phpjs.org/functions/strip_tags (http://kevin.vanzonneveld.net)
allowed = (((allowed || "") + "").toLowerCase().match(/<[a-z][a-z0-9]*>/g) || []).join(''); // making sure the allowed arg is a string containing only tags in lowercase (<a><b><c>)
var tags = /<\/?([a-z][a-z0-9]*)\b[^>]*>/gi,
commentsAndPhpTags = /<!--[\s\S]*?-->|<\?(?:php)?[\s\S]*?\?>/gi;
return input.replace(commentsAndPhpTags, '').replace(tags, function ($0, $1) {
return allowed.indexOf('<' + $1.toLowerCase() + '>') > -1 ? $0 : '';
});
}
【讨论】：
evt.data['html'] 替换为 event.data.dataValue
您可以使用whitelist plugin 在您的配置中定义允许和拒绝其他任何内容的元素和属性列表。
这与 Paul Tomblin 提出的解决方案基本相同，但它应该更容易处理更多元素而不是复制大量代码，并且它使用白名单而不是黑名单，因此任何不允许的内容都会被删除。
【讨论】：
CKEDITOR.config.fullPage = false
指示要编辑的内容是否作为完整的 HTML 页面输入。整页包括<html>、<head> 和<body> 元素。最终输出也将反映此设置，包括 <body> 内容，仅当此设置被禁用时。
【讨论】：
要添加我的输入，从 4.1 开始就有高级内容过滤器功能，它允许对允许的内容（哪些标签以及它们的样式/属性/类）进行非常具体的规则。我发现它非常强大并且配置非常好。
在http://docs.ckeditor.com/#!/guide/dev_advanced_content_filter 上阅读更多信息，但这里有一些来自页面的示例
config.allowedContent = true; // to allow all
// A rule accepting <p> and <h1> elements with optional "left" and "right" classes.
// Note: Both elements may contain these classes, not only <h1>.
config.allowedContent = "p h1(left,right)";
// Rules allowing:
// * <p> and <h1> elements with an optional "text-align" style,
// * <a> with a required "href" attribute,
// * <strong> and <em> elements,
// * <p> with an optional "tip" class (so <p> element may contain
// a "text-align" style and a "tip" class at the same time).
config.allowedContent = "p h1{text-align}; a[!href]; strong em; p(tip)";
【讨论】：