ckEditor中的body persitant内联风格

我正在尝试整天为ckeditor实例的body标签设置peristant风格属性。我在ckeditor.config api（仅bodyId和bodyClass）中找不到像bodyStyle之类的东西。所以我是想我自己，用以下解决方案（jQuery的使用）：ckEditor中的body persitant内联风格

$(this).find('textarea.editor').ckeditor().ckeditorGet().on('instanceReady', function(e){ 
    var documentWrapper = e.editor.document, 
    documentNode = documentWrapper.$, 
    inh = $(documentNode.body); 
    inh.css('background', inheritParentBackground); 
});

至极工作得很好，但我叫.updateElement（）或之后，如果我两次单击源按钮，它会再次删除所有样式，'instanceReady'不再被调用。我试图手动启动它，但它先运行样式更新并直接从ckeditor覆盖。

我实际要做的事情：我想在主页编辑一个div，然后用ckeditor编辑一个ajax弹出窗口，我希望编辑器具有相同的高度，宽度和背景，我可以不处理这个bodyId或bodyClass，所以我想我需要一个bodyStyle或某人有一个不同的想法。

来源

2010-08-31 fehrlich

它的“持久性”而不是“持续性” 。我通常不会纠正人们的拼写，但在这种情况下，它可能会影响使用搜索查找此问题的能力，因此您应该修复它！ – Doin 2013-07-13 16:44:48

我发现了一个肮脏的黑客：

$(this).find('textarea.editor').ckeditor({ 
     bodyId: Id+'" style="'+style, 
    });

不是很漂亮，但它工作;-)

来源

2010-09-01 10:06:39 fehrlich

是http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.html#.style你在找什么？

来源

2010-08-31 17:40:18 ryan

不，你只能用这个静态方法定义样式，但我不会看到我可以将它附加到一个实例。关闭是：http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.editor.html#addCss但是这个doent添加了一个样式属性，它具有最低的优先级，所以这个规则被任何东西所覆盖 – fehrlich 2010-08-31 18:55:08

你有两个选择。您可以在instanceReady处理程序通过添加内嵌样式表：

var myStyleSheet = e.editor.document.appendStyleText("body {background:...}");

这追加的空<style>元素编辑器的（的iframe）文件头，包含所提供的文本。返回值是CSSStyleSheet（浏览器DOM对象），所以如果将它保存在某处，可以使用JavaScript中的DOM方法添加，删除或修改样式规则。我不确定他们是否坚持模式更改（即单击“源”两次后）或调用setData（），但可以使用“模式”和“contentDom”事件捕获这些事件，并重新应用styleSheet事件处理程序。请注意（对于'模式'处理程序至少）您需要检查editor.mode==='wysisyg'，因为editor.document在源模式下为空。

在另一方面，如果你真的想直列设置您的样式编辑器的<body>元素，试图定义一个函数：

function setEditorStyle(e) 
{ 
    var ed = e.editor; 
    if (ed.mode!=="wysiwyg") return; // don't set styles when in "Source" mode 
    // now change whatever styles you want, e.g.: 
    ed.document.getBody().setStyles({backgroundColor:"blue",color:"#FFFFFF",...}); 
    // for setting just 1 style property, you can use .setStyle() instead 
}

那么你编辑的配置中，需要添加：

..., on: { instanceReady: setEditorStyle, mode: setEditorStyle, ... }, ...

这将在首次创建编辑器iframe之后以及切换回'wysiwyg'模式（正常编辑，而非源模式）之后设置样式。

我不知道为什么你的样式正在通过调用updateElement（）重置。我正在做同样的事情（使用CKEditor v4），并且updateElement（）不会重置我在<body>上设置的内联样式。也许这是CKeditor版本所改变的。无论如何，如果这是一个问题，您可以在调用updateElement（）之后再次手动重置样式。（我会说“只是调用setEditorStyle（）”，但是如上所示，该函数被编写为需要一个事件参数e。您可以改写它以使用外部定义的“ed”变量（例如全局变量） - 即改变

var ed = e.editor;

到

if (!ed) ed = e.editor;

然后你就可以安全地从任何一点在你的JavaScript编辑器创建后调用setEditorStyle（）。）

来源

2013-07-13 15:51:32 Doin

ckEditor中的body persitant内联风格

回答

相关问题