Question

我想在我的TinyMCE编辑器中添加键盘快捷键。

这是我的初始代码：

tinymce.init({
    selector: 'textarea',
    menubar: false,
    mode : "exact",
    plugins: [
    'advlist autolink lists link image charmap print preview anchor',
    'searchreplace visualblocks code fullscreen',
    'insertdatetime media table contextmenu paste code',
    'print'
    ],
    toolbar: 'print | styleselect | bullist numlist',
});

我知道我需要的是：

editor.shortcuts.add('ctrl+a', function() {});

但我不明白如何将快捷方式代码与我的初始化代码相关联。

TinyMCE文档here，但我无法理解它。

Answer 1

以下是如何操作：

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML

  // add your shortcuts here
  setup: function(editor) {
    editor.shortcuts.add('ctrl+a', function() {});
  }
});

使用setup init参数！

Answer 2

这是@Thariama提供的答案的扩展。对我有用的代码是：

tinymce.init({
    selector: 'textarea',
    menubar: false,
    mode : "exact",
    setup: function(editor) {
        editor.shortcuts.add('ctrl+a', desc, function() { //desc can be any string, it is just for you to describe your code.
            // your code here
        });
    },
    plugins: [
    'advlist autolink lists link image charmap print preview anchor',
    'searchreplace visualblocks code fullscreen',
    'insertdatetime media table contextmenu paste code',
    'print'
    ],
    toolbar: 'print | styleselect | bullist numlist',
});

或者你也可以使用以下内容，它可以覆盖TinyMCE保留的关键命令：

tinymce.init({
    selector: 'textarea',
    menubar: false,
    mode : "exact",
    setup: function(e) {
      e.on("keyup", function(e) {
        if ( e.keyCode === 27 ) {  // keyCode 27 is for the ESC key, just an example, use any key code you like
          // your code here
        }
      });
    },
    plugins: [
    'advlist autolink lists link image charmap print preview anchor',
    'searchreplace visualblocks code fullscreen',
    'insertdatetime media table contextmenu paste code',
    'print',
    ],
    toolbar: 'print | styleselect | bullist numlist',
});

Answer 3

作为前两个答案的补充，这是一个完整的例子：

tinymce.init({
//here you can have selector, menubar...
setup: function (editor) {
       setLocale(editor);
            // For the keycode (eg. 13 = enter) use: cf http://keycode.info 
            editor.shortcuts.add('ctrl+13', 'indent', function(){      
                tinymce.activeEditor.execCommand('indent');
            });

            editor.shortcuts.add('ctrl+f', 'subscript ', function(){      
                tinymce.activeEditor.execCommand('subscript');
            });
        },
        });

如何在TinyMCE v4中实现tinymce.Shortcuts

3 个答案: