ExtJS中子页面调用父页面元素有感

       最近一段时间在弄ExtJS有关的项目，发现自己对于JavaScript东东实在是欠缺很多东西，所以写这篇有感记录一下，希望对大家有点帮助,^V^。

       在ExtJS经常有使用TabPanel的例子，而TabPanel里的一个Panel镶嵌了一个JSP或者Html等等的子页面，而我们有时候需要在子页面上对父页面的

TabPanel进行一定的操作，比如说为TabPanel添加一个Panel，这样需要我们在子页面中能够获得父页面的TabPanel的对象或者在父页面中已经写好了的

对TabPanel添加Panel的方法。

       子页面中无需多说了，一般是使用 window.parent.XXX 或者 window.parent.XXX() 的方式获取父页面对象或者方法( 注意：XXX代表父页面的

对象或者方法 )，如以下代码（addTab是子页面function，goto是父页面的function）：

      

1 function addTab(url,proName,proId){
2          url = "projectInfo.jsp?projectId=" + url;
3          window.parent.goto(url,"项目概况",proName,proId,'4');
4 };

       有时候经常我们使用window.parent.goto()获取不到方法，这是为什么呢，主要在一个JS的一个作用域的问题，由于在ExtJS中父页面常常采用Ext.onReady()方法的一个使用，常常会将定义放在这个方法中，比如:

      

1 Ext.onReady(function(){
2     function goto(){
3          XXXXXXXXXX....
4     }
5    var centerPanel = Ext.TabPanel();
6 })

      这个地方的goto和centerPanel是处于Ext.onReady区域内的，作用域也在这个里面，不是全局的，所以我们在子页面访问不到，要访问是，就将方法和对象

放到Ext.onReady外面去。这样对于一些全局的方法，对象子页面有用的，我们在父页面里都设成全局的，以便于使用。