0

我正在尝试在tinymce 内部实现一个自定义按钮，单击该按钮时会在所选文本周围添加一个类。

我试过这个：

editor.ui.registry.addButton('fwnormal', {
    text: 'N',
    class: 'nongras'
});

但它不起作用，我得到一个错误Could not find valid *strict* value for "onAction"

知道我该怎么做吗？

4

3 回答 3

1

https://www.tiny.cloud/docs/configure/content-formatting/

使用如下代码：

tinymce.init({
  selector: "#mytextarea",
  tinymce options: ... ,

  toolbar: "add_class",

  setup: function(editor) {
    editor.on("init", function(e) {

      tinymce.activeEditor.formatter.register("new_class", {
        selector: "p,div,h1,h2,h3,h4,h5,h6", // choose elements
        classes: "myclass",
        styles: { ... },
        attributes: { ... },
      });  // close formatter.register

    });  // close editor.on init

    editor.ui.registry.addButton("add_class", {
      tooltip: "new class",
      icon: "edit-block", // look editor-icon-identifiers page
      onAction: function() {
        tinymce.activeEditor.formatter.apply("new_class");
      }
    }); // close registry.addButton

  }, // close setup function

}); // close tinymce.init

或尝试以下代码：

tinymce.init({
  selector: "#mytextarea",
  tinymce options: ... ,

  toolbar: "add_class",

  setup: function(editor) {

    editor.ui.registry.addButton("add_class", {
      tooltip: "new class",
      icon: "edit-block", // look editor-icon-identifiers page
      onAction: function() {
        var element = tinymce.activeEditor.selection.getNode();
        tinymce.activeEditor.dom.setAttrib(element, "class", "myclass");
      }
    }); // close registry.addButton

  }, // close setup function

}); // close tinymce.init
于 2020-06-22T17:58:22.170 回答
0

例子

tinymce.init({
  selector: 'textarea',
  style_formats: [
    {title: 'Class name', selector: 'p', classes: 'myclass'} 
  ]
});

http://fiddle.tinymce.com/Slhaab

于 2020-06-18T12:49:25.507 回答
0

自定义类在 style_formats https://www.tiny.cloud/docs/configure/content-formatting/中设置

于 2020-06-18T12:06:57.060 回答