Question

请参见最后的修改

我刚刚开始使用CodeMirror进行项目，而且我遇到了一个我完全不理解的问题。

问题是要处理CodeMirror的事件，特别是"select"事件，因为我正在处理"change"事件而没有问题我无法猜测发生了什么。

让我们看一些代码;我将CodeMirror对象包装到另一个对象中，它看起来类似于：

function expressionEditor(config)
{
    jQuery('#divEditor').append('<textarea id="expression"/>');

    this.editor = CodeMirror.fromTextArea(document.getElementById('expression'),
    {
      mode:        'custom',
      lineNumbers: true,
      extraKeys:   {'Ctrl-Space': 'autocomplete'}
    });

    this.OnChange = function(instance, object)
    {
      if (object.text[0] === '.')
      {
        CodeMirror.showHint(this.editor, CodeMirror.hint.custom);
      }
    };

    this.OnSelectHint = function(completion, Element)
    {
      alert(completion + ' : ' + Element);
    };

    CodeMirror.on(this.editor, 'change', jQuery.proxy(this.OnChange, this));

    CodeMirror.on(this.editor, 'select', jQuery.proxy(this.OnSelectHint, this));
}

正如我所说的，事件"change"按预期工作，当我在编辑器中写一个点时，它调用函数this.OnChange来调用提示列表，但是当我浏览建议的提示时{永远不会调用{1}}函数（导航器上不会弹出this.OnSelectHint）。

根据CodeMirror documentation关于alert事件，回调必须是“在选择完成时触发。传递完成值（字符串或对象）和表示它的DOM节点在菜单中“。

由于其他事件正在发挥作用，我完全迷失了...对于发生了什么事的任何线索？

修改

如Marijn所述，CodeMirror中没有"select"事件; "select"事件来自"select" CodeMirror插件。只是为了知道：

如何处理CodeMirror Addons触发的事件？

Answer 1

CodeMirror API中没有"select"事件。因此，倾听它绝对不会做任何事情。

Answer 2

问题是来自"select"的{{1}}事件是在自动完成建议数组上触发的，而不是在CodeMirror编辑器本身上触发的。

如here所述，您可以通过包装show-hint函数在该对象上设置事件处理程序。例如，使用show-hint插件：

sql-hint

这里const sqlHint = CodeMirror.hint.sql; CodeMirror.hint.sql = (cm, options) => { const result = sqlHint(cm, options); if (result) { CodeMirror.on(result, 'shown', onAutocompleteShown); CodeMirror.on(result, 'select', onAutocompleteSelect); } return result; }和onAutocompleteShown是事件处理程序。

CodeMirror OnSelect事件不起作用

修改

2 个答案: