0

所以我对 tinymce4 api 有一点问题，iv 创建了一个自定义格式，我想用一个按钮来触发。然而，当按钮被点击时，样式会被应用到按钮上，而不是实际的 contenteditable 字段。

tinymce.init({
    selector: '#editable',
    inline: true,
    menubar: false,
    toolbar:false,
    statusbar: false,
});

setTimeout(function(){
    tinymce.activeEditor.formatter.register('mycustomformat', {
   inline : 'span',
   styles: {color: 'red'}
 });
},200);

$('.js-toggleformat').on('click', function(e) {
    tinymce.activeEditor.formatter.apply('mycustomformat');
})

和html：

<button class="js-toggleformat">Toggle</button>

<div id="editable" contenteditable="true"></div>
4

2 回答 2

2

看一个例子。tinymce 插件“textcolor”使用函数“applyFormat”来应用颜色。它看起来像这样：

function applyFormat(format, value) {
  editor.focus();
  editor.formatter.apply(format, {value: value});
  editor.nodeChanged();
}

基于此，这应该适用于您的情况：

tinymce.activeEditor.focus();
tinymce.activeEditor.formatter.apply('mycustomformat');
tinymce.activeEditor.nodeChanged();
于 2014-11-29T17:07:11.893 回答
0

我有类似的问题。我猜你正在使用内联编辑选项。当您在编辑字段之外单击时，tinymce id 会停用。

您可以通过两种方法解决此问题：

  1. 您可以自定义工具栏并在工具栏中添加所需的格式
  2. 在 tinymce 模糊事件上，使用 rangy 库存储范围。在按钮上单击首先激活tinymce，恢复保存的范围，然后使用tinymce格式化程序切换样式

希望这可以帮助。

于 2013-08-15T03:30:37.197 回答