Всплывающее детектирование фокуса с плавающей точкой 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

Это может быть достигнуто добавлением событие размытия окна внутр элемента, ниже приведен пример кода

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