wysihtml5 - wysihtml5 编辑器 - 如何简单地将类添加到元素？

Question

我很喜欢wysihtml5，但我找不到任何关于向元素添加类这样简单的文档。

基本上我正在寻找的是一种允许对 blockquote 元素进行 2 种不同变化的方法：

blockquote.pull-left blockquote.pull-right

（每个类指定不同的样式属性）

所以理想情况下，我想创建 2 个额外的工具栏按钮，让我不仅可以使用 formatBlock 命令（使用 blockquote 元素包装选择），还可以指定 blockquote 的类。

任何想法？

Answer 1

为了清楚起见，尝试将这样的自定义函数添加到单独的 custom.js 文件中：

wysihtml5.commands.custom_class = {
  exec: function(composer, command, className) {
    return wysihtml5.commands.formatBlock.exec(composer, command, "blockquote", className, new RegExp(className, "g"));
  },
  state: function(composer, command, className) {
    return wysihtml5.commands.formatBlock.state(composer, command, "blockquote", className, new RegExp(className, "g"));
  }
};

然后在你的工具栏中传递类名，假设类是“左拉”：

<a data-wysihtml5-command="custom_class" data-wysihtml5-command-value="pull-left">Pull left</a>

您还必须将任何自定义类添加到“白名单”中，方法是转到 advanced.js 文件并将它们添加到类下，否则当您保存时这些类将被删​​除。