ExtJSフローティングウィンドウのフォーカスが失われる

Question

フローティングウィンドウのフォーカスが失われているかどうかを検出する効率的な方法があるかどうかは疑問です。私はユーザーの一時的な入力のためのフローティングウィンドウを持っている、私は入力操作（例えば、他の場所でクリック）後にそれを隠すのを忘れた場合、このウィンドウを自動的に隠すことをやりたい。ウィンドウの要素にブラーイベントを使用しようとしましたが、何も起こりませんでした。 作業デモ：demo

ありがとうございました！

Answer 1

ウィンドウがぼやけているかどうかを検出する前に、最初にウィンドウをぼかすためのアクションが必要です。ユーザーが「他の場所をクリックする」とウィンドウがぼやけてしまうことを言いました。あなたはmainPanelにリスナーを追加することによって、これを達成することができます

var mainPanel = new Ext.Panel({ //define a main non-floating panel 
    title: 'main', 
    id: 'mainPanel', 
    width: 400, 
    height: 400, 
    listeners: { 
     afterrender: function(self) { 
      self.body.on('click', function() { 
       alert('clicked') 
      }); 
     } 
    } 

}); 

パネル本体がクリックされたら、あなたはそれが実際に火災のために待機しているイベントをfloatWinをぼかすことができます。

Answer 2

これは、以下、内線ウィンドウ要素にblurイベントを追加することを実現することができますが、サンプルコード

Ext.applyIf(me, { 
     items: [ 
      { 
       xtype: 'button', 
       text: 'Done', 
       listeners: { 
        click: { 
         fn: me.onDoneButtonClick, 
         scope: me 
        } 
       } 
      } 
     ], 
     listeners: { 
      el: { 
       blur: { 
        fn: me.onWindowLoseFocus, 
        scope:me 
       } 
      }    
     } 
    });