Extjs模态窗口聚焦回控件

Extjs模态窗口聚焦回控件,extjs,extjs4,Extjs,Extjs4,我显示了一个带有一些输入控件的模式窗口。当我按下“tab”键时,它会在控件中导航 如果我继续按“tab”,它会在某个时刻聚焦此窗口后面的控件,我甚至可以键入此控件 我正在使用ExtJS4.1 谢谢。这是Extjs中著名的bug。选中此项: .做了一些变通,为我工作,请查看此信息并让我知道。 /* ***For activation of Tab Key only to the active panel****/ Ext.EventManager.on(Ext.getBody(), 'keyd

我显示了一个带有一些输入控件的模式窗口。当我按下“tab”键时,它会在控件中导航

如果我继续按“tab”,它会在某个时刻聚焦此窗口后面的控件,我甚至可以键入此控件

我正在使用ExtJS4.1


谢谢。

这是Extjs中著名的bug。选中此项:
.

做了一些变通,为我工作,请查看此信息并让我知道。

/* ***For activation of Tab Key only to the active panel****/


Ext.EventManager.on(Ext.getBody(), 'keydown', focusListenerLogin, Ext.getBody());
Ext.EventManager.on(Ext.getBody(), 'keyup', focusListenerLogin, Ext.getBody());
Ext.EventManager.on(Ext.getBody(), 'keypress', focusListenerLogin, Ext.getBody());
Ext.EventManager.on(Ext.getBody(), 'focusin', focusListenerLogin, Ext.getBody());


/***Here the Function is defined.***/

function focusListenerLogin(e) {

if(typeof Ext.WindowManager.getActive() !== 'undefined' && Ext.WindowManager.getActive() !== null) {
    var activeWinId = Ext.WindowManager.getActive().getId ();
    var obj = Ext.getCmp(activeWinId);
    var id = typeof obj.focusEl !=='undefined' ? obj.focusEl.id : obj.id;
    window.prevFocus;


    var dom = activeWinId;
    var components = [];
    Ext.Array.each(Ext.get(dom).query('*'), function(dom) {
      var cmp = Ext.getCmp(dom.id);
      if(cmp && cmp.isVisible()) {
      if (cmp && cmp.btnEl && cmp.btnEl.focusable())
        components.push(cmp.btnEl);
      else if(cmp && cmp.inputEl && cmp.inputEl.focusable())
        components.push(cmp.inputEl);
      }
    });


    if (typeof obj != 'undefined' && obj.isVisible() && obj.el.id === activeWinId && (typeof e.keyCode!== 'undefined' ? e.keyCode === 9 : true) ) {
        var focused = document.activeElement;

     if (!focused || focused === document.body){ focused = null;}
        else if (document.querySelector) focused = document.querySelector(":focus");

     if( typeof window.prevFocus !=='undefined' && window.prevFocus !== null && focused !== window.prevFocus && components.length>0 && window.prevFocus.id === components[components.length-1].id) {

         Ext.getCmp(id).focus();
         window.prevFocus = document.activeElement; 
         }
     else if(components.length==0 ) {

         Ext.getCmp(id).focus(); 
         window.prevFocus = document.activeElement; 
     }
     else
     window.prevFocus = focused !== null ? focused : window.prevFocus;
    }
    return false;
}



}
逻辑是

  • 如果焦点从窗口组件的最后一个元素移出,则它将被重新指定给第一个元素

  • 如果窗口没有任何可聚焦元素,则焦点将仅保留在窗口上


  • 如果这段代码对您有帮助,请告诉我。

    此错误在ExtJS 5.0.1.1255版上仍然存在。有什么建议吗?
    /* ***For activation of Tab Key only to the active panel****/
    
    
    Ext.EventManager.on(Ext.getBody(), 'keydown', focusListenerLogin, Ext.getBody());
    Ext.EventManager.on(Ext.getBody(), 'keyup', focusListenerLogin, Ext.getBody());
    Ext.EventManager.on(Ext.getBody(), 'keypress', focusListenerLogin, Ext.getBody());
    Ext.EventManager.on(Ext.getBody(), 'focusin', focusListenerLogin, Ext.getBody());
    
    
    /***Here the Function is defined.***/
    
    function focusListenerLogin(e) {
    
    if(typeof Ext.WindowManager.getActive() !== 'undefined' && Ext.WindowManager.getActive() !== null) {
        var activeWinId = Ext.WindowManager.getActive().getId ();
        var obj = Ext.getCmp(activeWinId);
        var id = typeof obj.focusEl !=='undefined' ? obj.focusEl.id : obj.id;
        window.prevFocus;
    
    
        var dom = activeWinId;
        var components = [];
        Ext.Array.each(Ext.get(dom).query('*'), function(dom) {
          var cmp = Ext.getCmp(dom.id);
          if(cmp && cmp.isVisible()) {
          if (cmp && cmp.btnEl && cmp.btnEl.focusable())
            components.push(cmp.btnEl);
          else if(cmp && cmp.inputEl && cmp.inputEl.focusable())
            components.push(cmp.inputEl);
          }
        });
    
    
        if (typeof obj != 'undefined' && obj.isVisible() && obj.el.id === activeWinId && (typeof e.keyCode!== 'undefined' ? e.keyCode === 9 : true) ) {
            var focused = document.activeElement;
    
         if (!focused || focused === document.body){ focused = null;}
            else if (document.querySelector) focused = document.querySelector(":focus");
    
         if( typeof window.prevFocus !=='undefined' && window.prevFocus !== null && focused !== window.prevFocus && components.length>0 && window.prevFocus.id === components[components.length-1].id) {
    
             Ext.getCmp(id).focus();
             window.prevFocus = document.activeElement; 
             }
         else if(components.length==0 ) {
    
             Ext.getCmp(id).focus(); 
             window.prevFocus = document.activeElement; 
         }
         else
         window.prevFocus = focused !== null ? focused : window.prevFocus;
        }
        return false;
    }
    
    
    
    }