2

我想创建一个基于 Web 的所见即所得 HTML 编辑器，它允许用户插入具有某些类或 id 属性的预定义 HTML 元素。

例如，任何 HTML 编辑器都允许用户选择一些文本并单击“粗体”按钮，这会将所选文本包装在<b></b>标签中。

我希望用户能够选择一些文本，单击一个名为“somebutton”的按钮并将所选文本包装在 中<div class="someclass"></div>，或者单击不同的按钮并将文本包装在 中<h1 id="someid"></h1>，或者具有由我。

我知道那里有很多基于 javascript 的 HTML 编辑器，但我特意寻找能够以上述方式轻松扩展的任何内容。我看过 TinyMCE 和 Aloha，在这两种情况下都发现文档很难使用或根本不存在。

我在寻找：

  1. 任何易于以这种方式扩展的编辑器的建议
  2. 如上所述添加自定义元素的教程或说明

谢谢！

4

1 回答 1

0

CKEditor 提供了一个灵活的样式系统，规则定义如下（在配置中styles.js或直接在配置中）：

{
    name: 'My style',
    element: 'h2',
    attributes: {
        'class': 'customClass',
        id: 'someId'
    },
    styles: {
        'font-style': 'italic'
    }
},

生产：

<h2 class="customClass" id="someId" style="font-style:italic;">Custom element</h2>

定义后，样式可以直接从样式组合框获得，可以应用于当前选择或新元素。

样式可以动态创建，通过API应用于范围和元素。Stylesheet Parser插件可以直接从 CSS 文件中提取样式。

注意：定义自定义样式可能需要正确配置高级内容过滤器（自 CKEditor 4.1 起）。

于 2013-07-23T13:53:16.023 回答