CodeMirror OnSelect 事件不起作用

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 ，但是當我瀏覽建議的提示時，永遠不會調用this.OnSelectHint函數（導航器上沒有彈出alert ）。

根據關於"select"事件的CodeMirror 文檔，回調必須是“選擇完成時觸發。傳遞完成值（字符串或對象）和在菜單中表示它的 DOM 節點”。

由於其他事件正在起作用，我完全迷失了......關於發生了什么的任何線索？

---

編輯

正如Marijn所說， CodeMirror 中沒有"select"事件； "select"事件來自show-hint CodeMirror 插件。 只為了解：

• 如何處理 CodeMirror 插件觸發的事件？

Answer 1

CodeMirror API 中沒有"select"事件。 因此，傾聽它絕對沒有任何作用。

Answer 2

問題是來自show-hint的"select"事件是在自動完成建議數組上觸發的，而不是在 CodeMirror 編輯器本身上觸發。

如上所述在這里，你可以通過你的包裹設置對象的事件處理程序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和onAutocompleteSelect是事件處理程序。