100分求解——EXT 事件处理方面的问题

1、按理说，document 对象是最外层的对象，那么即然是最外层，为什么 EXT 对象中的单击事件传不到   document？难道 EXT 的事件处理机制不是向上（父对象）传递的？我现在有一个JSP页面的对象层次结构是这样的：div1、div3 中的单击都能传递到 document，而 div2 下 
Ext.ux.ManagedIframePanel 中的其他EXT对象上的事件就传不到 document，为什么？<head>
</head>
<body>
    <div id='div1'>
        <table>
            <tr>  </tr>    <tr>  </tr>
        </table>
        <table>
            <tr>  <td>
                      <ul>
                          <table>  <tr>  <td>
                              <li> </li>  <li> </li>  <li> </li>
                          </td>  </tr>  </table>
                      </ul>
            </td>  </tr>
        </table>
    </div>
    <div id="div2">
        Ext.ux.ManagedIframePanel              // 我所有的 EXT 界面对象都放在这里面
    </div>
    <div id="div3">
    </div>    <script type="text/javascript">
[code=JScript]        document.onclick = function(e) {
            alert(this.id);
        }
    </script>
</body>
[/code]

解决方案 »

  1.   

    1、按理说，document 对象是最外层的对象，那么即然是最外层，为什么 EXT 对象中的单击事件传不到  document？难道 EXT 的事件处理机制不是向上（父对象）传递的？我现在有一个JSP页面的对象层次结构是这样的：div1、div3 中的单击都能传递到 document，而 div2 下 
    Ext.ux.ManagedIframePanel 中的其他EXT对象上的事件就传不到 document，为什么？
    <head>
    </head>
    <body>
        <div id='div1'>
            <table>
                <tr>  </tr>    <tr>  </tr>
            </table>
            <table>
                <tr>  <td>
                          <ul>
                              <table>  <tr>  <td>
                                  <li> </li>  <li> </li>  <li> </li>
                              </td>  </tr>  </table>
                          </ul>
                </td>  </tr>
            </table>
        </div>
        <div id="div2">
            Ext.ux.ManagedIframePanel              // 我所有的 EXT 界面对象都放在这里面
        </div>
        <div id="div3">
        </div>    <script type="text/javascript">
            document.onclick = function(e) {
                alert(this.id);
            }
        </script>
    </body>
      

  2.   

    ext在处理的过程中取消了冒泡。所以你就没有往外层冒泡了~
      

  3.   

    我就是想，当用户在 ext 对象上单击鼠标时隐藏我的下拉主菜单，让已经下拉下来的主菜单收回去；我是这样布局的：body 里面最顶层是“标题和主菜单区”，中间是“EXT 各功能模块的界面区”最下边是“状态栏区” var viewport = new Ext.Viewport({
    layout: 'border',
    items: [{
    contentEl: 'header',
    region: 'north',
    xtype: 'panel',
    border: false
    }, {
    contentEl:'workarea',
    xtype:'panel',
    layout:'border',
    region:'center',
    border:false,
    items:[new Ext.ux.ManagedIframePanel({
    id:'globalFrame',
    region : 'center',
    margins : '0 0 5 5',
    border : false,
    loadMask : true
    })]
    },{
    contentEl:'footer',
    region:'south',
    border : false,
    frame:true,
    height:25,
    xtype:'panel'
    }]
    });就在中间区用了 Ext.ux.ManagedIframePanel 这个，各子功能界面都放在 Ext.ux.ManagedIframePanel 里面！