如何在 CodeMirror 中触发键盘事件

How can I trigger keyboard events in CodeMirror?

本文关键字:键盘 事件 CodeMirror      更新时间:2023-09-26

我正在使用不同的文本字段作为CodeMirror的代理。我想使用通过键盘事件(如keydownkeypresskeyup)激活的closebrackets.js等功能。我尝试了几种不同的方法来触发这些事件,但没有一种方法导致 CodeMirror 收到任何内容:

kc = 219
e = $.Event 'keydown', { which: kc }
$( myCodeMirror.getInputField() ).trigger e

不行。不会触发任何事件。

cmIF = $( myCodeMirror.getInputField() )
textArea = $('<textarea></textArea>')
$('body').append textArea
textArea.keydown (e) ->
    cmIF.focus()
    return
kc = 219
e = $.Event 'keydown', { which: kc }
textArea.trigger e

尝试从其他文本区域转发事件。不行。CM 不 事件不会被触发。

$( myCodeMirror.getWrapperElement() ).children().each (index) ->
    $(this).trigger e
    return

尝试在 CM 包装器的每个子级上触发事件。不行。未触发 CM 事件。

我在这里做错了什么?如何在 CodeMirror 实例上触发键盘事件?

我不确定我是否 100% 理解您,但目前我在为 codemirror 实例定义配置选项时定义了键盘事件。

var cmInstance = CodeMirror(target, {
    value: myTextArea.value,
    //other options here perhaps
    //defining some keyboard shortcuts
    extraKeys: {
        "Ctrl-J": "toMatchingTag",
        "Ctrl-S": function(cm) {
            saveCode(cm); //function called when 'ctrl+s' is used when instance is in focus
        },
        "F11": function(cm) {
            toggleFullscreen(cm,true); //function called for full screen mode 
        },
        "Esc": function(cm) {
            toggleFullscreen(cm,false); //function to escape full screen mode
        }
    }
});

请记住,这些函数仅在代码镜像实例处于焦点状态时触发。然后,您可以在函数中做任何您喜欢的事情,甚至可以添加新的侦听器以查看发生了哪种事件(?

我希望这有所帮助。

codemirror 附带了一个未记录的函数 triggerOnKeyDown,您可以使用它触发 codemirror 上的键:

const ev = {
  type: 'keydown',
  keyCode: 40 // the keycode for the down arrow key, use any keycode here
}
cm.triggerOnKeyDown(ev)

我也得到了同样的痛苦,最后我找到了解决方案。我不知道这是否是丑陋的黑客,但它对我有用。希望它对你有用。

myCodeMirror.options.extraKeys.F11(); //trigger F11 assigned function
myCodeMirror.options.extraKeys.["Ctrl-S"](); //trigger Ctrl-S assigned function