为什么TabPanel(ExtJs)无法正常加载页面呢？

Question

本帖最后由 HuangVince 于 2009-08-09 22:38:58 编辑

Answer 1

报什么错？
以下可以<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="extjs/ext-all.js"></script>
<script>
var panel=new Ext.TabPanel({ 
width:600, 
height:250, 
plain:true, 
defaults:{autoScroll: true}, 
items : [{ 
xtype : "panel", 
title : "Test1", 
autoLoad:{url:"test.html",scripts:true} 
//html:"This is Test1." 
},{ 
xtype : "panel", 
title : "Test2", 
html:"This is Test2." 
},{ 
xtype : "panel", 
title : "Test3", 
html:"This is Test3." 
}], 
activeTab : 0 
}); Ext.onReady(function(){
panel.render("TabPanel");
});
</script>
<div id="TabPanel"></div>

Answer 2

没报错，报错就好办了。就是加载不上去，只显示Loading....

Answer 3

那可能url的地址不对，单独访问url看行不行

Answer 4

单独访问是可以的。就连下载下来的ExtJs的示例也不行。

Answer 5

你是用http://xxx/xx.html这样的方式访问页面吗？
如果直接双击打开htm是不行的。

Answer 6

<script>
var panel=new Ext.TabPanel({ 
    width:600, 
    height:250, 
    plain:true, 
    defaults:{autoScroll: true}, 
    items : [{ 
        xtype : "panel", 
        title : "Test1", 
        html:"<iframe src='test.html'></iframe>" 
        },{ 
        xtype : "panel", 
        title : "Test2", 
        html:"This is Test2." 
        },{ 
        xtype : "panel", 
        title : "Test3", 
        html:"This is Test3." 
    }], 
    activeTab : 0 
}); Ext.onReady(function(){
    panel.render("TabPanel");
});
</script><div id="TabPanel"></div>
测试通过。

Answer 7

我现在按照你的这个方法发布后是可以了，但是test.html里面的JavaScript无法执行，提示：缺少对象。但是我单独运行test.html是可以的（以http形式打开的）。请问这个怎么处理呢？
为什么要以Http方式打开呢？是不是和ExtJs的内部机制有关呢？请不吝赐教！谢谢

Answer 8

请问我为什么我里面的Javascript不能执行呢？
这个是我test.html里面引用的Js<script type="text/javascript" src="JS/show.js"></script>
<input type="button" style="width:70px" value="测试" onClick="doTest();">
<div id="test">
....
</div>
show.js如下function doTest()
{
    var test=document.getElementById('test');
    test.style.zIndex=100001;
    test.style.position="absolute";
    test.style.left=200;
    test.style.top=200;
    test.style.display="";
}
当然我也试了把这个JavaScript直接放在test.html也是没有见效。
不过我试过放在引用test.html这个页面上是可以。
我的另外一个页面也有相同的操作，也有test这个层（当然内容不一样），也是被TabPanel这个页面调用了。这样就会出现一个层乱跳了。

Answer 9

当然要使用http的形式访问才有效，因为autoLoad采用的是ajax加载方式。我相信你在看extjs的API的时候会发现API不能那个用这个问题。他们都是同一个问题。ajax不能在本地路径下执行