在 CKEditor 中使用 xml 片段答案

【问题标题】：working with xml snippets in CKEditor在 CKEditor 中使用 xml 片段
【发布时间】：2010-08-10 08:54:59
【问题描述】：

我在我的应用程序中使用 CKEditor，用户可以在其中编写博客、创建页面等，编辑器禁用源模式。在编辑器的文本区写入xml，保存内容后不保留。我清楚地看到内容经过 HTML 编码，并且作为输入提供给 CKEditor 的 textarea。

【问题讨论】：

标签： ckeditor

【解决方案1】：

按设计工作。无论您进入所见即所得区域，都将获得 HTML 编码。你想如何改变它？

如果你想要一个用于编写 XML 的文本编辑器，也许这个问题的答案很有用：Textarea that can do syntax highlighting on the fly?

【讨论】：

但是同样应该显示为xml sn-p on view of the content is not?
@Ama 我不明白你的意思，你能澄清一下吗？
我像这样在编辑器中输入了 xml 并保存了内容。我向编辑提供了相同的内容。文本区域中不显示任何内容。

【解决方案2】：

我也希望 CKEditor 支持 XML 标记，但我知道您不能只在主窗口中输入它们 - 此处输入的任何内容都被假定为实际内容，而不是标记，因此会被编码。

我喜欢要做的是定义一个样式列表，这些样式会导致我选择的标签被使用，例如如果用户选择“示例”样式，CKEDitor 会执行<x>content</x>。不幸的是，尽管破解了 dtd.js 文件，但我并没有取得太大的成功。

我当前的解决方案是定义样式列表，但将它们映射到标准 HTML 标记，然后将所需的 XML 标记名称作为属性放入。然后我需要编写一些 XSLT 来转换数据。

CKEDITOR.stylesSet.add('myStyles',
[{
  name: 'Example sentence', 
  element: 'span', 
  attributes: {'class': 'example', 'data-xmlTag': 'x'} 
}];        

config.stylesSet = 'myStyles';

element 指定一个标准的 HTML 标签——如果我希望 XML 是内联的，我使用 <span>，如果我希望它是块级别的，我使用 <div>。 data-xmlTag 属性表示我实际想要使用的 XML 标记（在本例中为 x）。 class 允许我在 CSS 中定义一些样式，这意味着我可以将多个 XML 标记分组到一个类名下。定义一些 CSS：

config.contentsCss = CKEDITOR.basePath+'tagStyles.css';

【讨论】：