フォーカスが別の入力ボックスにある場合、Handsontableセルはまだフォーカスしています(Handsontable cell is focusing,when focus in another input)

質問説明:handsontableのセルを右クリックすると、右クリックメニューにポップアップダイアログボックスがあり、ポップアップダイアログボックスでjqueryのfocusメソッドを使用してダイアログボックスの入力ボックスに焦点が当てられ、カーソルも入力ボックスで点滅し、キーボードを叩いて入力すると、handsontbaleセルの内容を直接修正したなんて.githubには似たようなissueがありますが、マウスでダイアログボックスをクリックすると、私は正常に私のダイアログボックスに内容を入力することができます.これは不思議で、お父さんと言わざるを得ません.
では、どのように解決すればいいのでしょうか.
handsontableに何百回も虐げられた私は、もう一度handsontableのソースコードを開けて、3万行近くのコードを開けて、開くたびに愚かな顔をしていました.まず、私は最も愚かな方法で問題の場所を特定し、jsファイルの中でkeydownイベントがある場所をグローバルに検索しました.いずれにしても、handsontableはkeydownイベントを傍受しているに違いありません.そして、ブレークポイントを打って、andデバッグをテストし始め、handsontableにブレークポイントを打つと、keydownイベントをトリガーすると、どのコードブロックに入るかを発見するのは難しくありません.何回かデバッグした後、6633行にあるfunction onKeyDown(event)にナビゲートしましたが、問題が発生しました.このイベントはどこでバインドされていますか?次に、6776行の位置にdocumentのkeydownバインドがあります.コードは次のとおりです.

function init() {
    instance.addHook('afterDocumentKeyDown', onKeyDown);
    eventManager.addEventListener(document.documentElement, 'keydown', function(event) {
      instance.runHooks('afterDocumentKeyDown', event);
    });
    function onDblClick(event, coords, elem) {
      if (elem.nodeName == 'TD') {
        _this.openEditor();
        if (activeEditor) {
          activeEditor.enableFullEditMode();
        }
      }
    }
    instance.view.wt.update('onCellDblClick', onDblClick);
    instance.addHook('afterDestroy', function() {
      destroyed = true;
    });
  }

バージョンによっては、場所が異なる場合があります.jsファイルで「afterDocumentKeyDown」を直接検索して位置決めできます.
見つけた以上、直接直しましょう.どうやって直しますか.これはまた問題です.もし直接イベントの傍受を変更したら、handsontableの正常な入力行為にも問題があることがわかります.では、イベントがトリガーされたときに判断ロジックを増やしますか?そうすると、handsontableのイベントが私たちに阻止されたことに気づきますが、私たち自身のダイアログボックスの入力イベントはまだありません.行きたいですか、それともソースから修正したいですか.handsontableがdocumentのkeydownイベントを傍受している以上、イベント監視をhandsontable自体に移行すればいいのではないでしょうか.
上のコードをよく見ると、handsontableはeventManagerを通過していることがわかります.addEventListenerはイベントをバインドし、このメソッドが存在する場所を見つけ、8730行でバインドイベントの論理を変更します.

  addEventListener: function(element, eventName, callback) {
    **if(element.nodeType == 9 || (element.nodeType == 1 && (eventName == "keydown" || eventName == "keyup"))){
        element = this.context.rootElement ? this.context.rootElement : this.context.wtTable.wtRootElement.parentElement;
    }**
    var $__3 = this;
    var context = this.context;
    function callbackProxy(event) {
      if (event.target == void 0 && event.srcElement != void 0) {
        if (event.definePoperty) {
          event.definePoperty('target', {value: event.srcElement});
        } else {
          event.target = event.srcElement;
        }
      }
      if (event.preventDefault == void 0) {
        if (event.definePoperty) {
          event.definePoperty('preventDefault', {value: function() {
              this.returnValue = false;
            }});
        } else {
          event.preventDefault = function() {
            this.returnValue = false;
          };
        }
      }
      event = extendEvent(context, event);
      callback.call(this, event);
    }
    this.context.eventListeners.push({
      element: element,
      event: eventName,
      callback: callback,
      callbackProxy: callbackProxy
    });
    if (window.addEventListener) {
      element.addEventListener(eventName, callbackProxy, false);
    } else {
      element.attachEvent('on' + eventName, callbackProxy);
    }
    Handsontable.countEventManagerListeners++;
    return (function() {
      $__3.removeEventListener(element, eventName, callback);
    });
  }

問題が解決したことに気づいたのか、perfect!