`

超简单实现:Ext.TabPanel加入iframe

阅读更多

          太简单了,参考代码:

 funtab.add({
                   title:titleText ,
                   id:'tab_'+id,
                   iconCls: 'tabs',                  
                   margins:'0 4 4 0',
                   autoHeight:true,
                   autoScroll:true,
                   autoWidth:true,
                   closable:true,
                   frame:true,
                   html:'<iframe src="'+UrlText+'" width="100%" height="400" frameborder="0" scrolling="auto"></iframe>'
             }).show();

          大家注意一下html:的属性,只要加入就行了,根本不需要创造一个Ext.DomHelper.append的iframe的对象,然后再加入到tabpanel当中,

 

 

分享到:
评论
22 楼 lip5218 2009-03-05  
boyjunqiang 写道
可以从后台返回要显示的组件代码,然后eval一下加载到TabPanel中,没必要搞什么iframe


你说的这样应该怎么做了,我想像你这样实现!要是能看见 ,说下把!
21 楼 yukw1984 2008-12-24  
楼主 怎样让一个iframe中的内容 刷新?
20 楼 szm 2008-12-24  
用IFRAME太复杂了,问题还很多,不过我开始也这么想。
其实直接用Panel 的 load方法就可以异步的加载一个新的页面,非常方便。不过页面里最好就别再有html , body,head这里的标签了。
19 楼 kimmking 2008-07-29  
lovext 写道
gdipkf1986 写道
Ext.get("youID").src="you page"

这样应该就可以了。


用iframe确实很好很强大....重复加载的问题楼主考虑过没有?加载十个页面,如果十个页面都有用到Ext的功能,那不是十个页面都要重新加载一次ext-all.js,ext-all.css....很恐怖的一个基数。直接用Ext加载内容没有重复加载的情况发生。


对于这个问题,不会重复加载。
刚才看了一下IE用到的Internet临时文件,里面缓存了那些文件的。

当然,设置不同,可能会有不同。


明显混淆了加载和下载的区别
18 楼 chenxiaoji 2008-07-29  
请问height="400"能否改成和右框架高度一致,我试了很多方法都不行!!!
17 楼 boyjunqiang 2008-04-17  
可以从后台返回要显示的组件代码,然后eval一下加载到TabPanel中,没必要搞什么iframe
16 楼 xuyongping 2008-04-10  
gdipkf1986 写道
Ext.get("youID").src="you page"

这样应该就可以了。


用iframe确实很好很强大....重复加载的问题楼主考虑过没有?加载十个页面,如果十个页面都有用到Ext的功能,那不是十个页面都要重新加载一次ext-all.js,ext-all.css....很恐怖的一个基数。直接用Ext加载内容没有重复加载的情况发生。


我最近才学Extjs ,Ext的加载还是加载的IFrame 吗。。。?
15 楼 pensun37 2008-04-07  
这样写就行了,搞那么麻烦
html:'<iframe id="test" src="'+UrlText+'" width="100%" height="400" frameborder="0" scrolling="auto"></iframe>'
14 楼 WaterSugar 2008-04-01  
这里的重复加载并不是指IE里面下载两套Ext框架文件,而应该是又重新初始化一次Ext框架,而这个框架是相当占资源的,我测试过,在TapPanel中通过IFrame载入目标页和通过autoLoad载入目标页所占用的资源多得多。这是我的理解而已。
13 楼 lovext 2008-03-31  
gdipkf1986 写道
Ext.get("youID").src="you page"

这样应该就可以了。


用iframe确实很好很强大....重复加载的问题楼主考虑过没有?加载十个页面,如果十个页面都有用到Ext的功能,那不是十个页面都要重新加载一次ext-all.js,ext-all.css....很恐怖的一个基数。直接用Ext加载内容没有重复加载的情况发生。


对于这个问题,不会重复加载。
刚才看了一下IE用到的Internet临时文件,里面缓存了那些文件的。

当然,设置不同,可能会有不同。
12 楼 hantsy 2008-03-31  
用iframe 就不用说了,web设计大忌
11 楼 WaterSugar 2008-03-28  
是的,我也一直在看Ext,如果一个左边Tree,右边TabPanel结构的页面,当点击左边树节点,在右边增加一个TabPanel的方法中,这个是算比较简单的了,但是我真担心重复加载的问题,我现在用自己构建TabPanel的方法,但又是不好控制,不知道用IFrame要不要担心重复加载的问题?
10 楼 jaminiteio 2008-03-27  
加上dom这个果然成功了,谢谢wtusmchen ,不知道为什么要加上这个dom?
9 楼 jaminiteio 2008-03-27  
wtusmchen 写道
我是这么用的:
html:'<iframe id="test" src="'+UrlText+'" width="100%" height="400" frameborder="0" scrolling="auto"></iframe>'

Ext.get('test').dom.src = '*****';

那个html是Ext.TabPanel里的?
8 楼 wtusmchen 2008-03-27  
我是这么用的:
html:'<iframe id="test" src="'+UrlText+'" width="100%" height="400" frameborder="0" scrolling="auto"></iframe>'

Ext.get('test').dom.src = '*****';
7 楼 jaminiteio 2008-03-27  
我怎么用Ext.get("youID").src="you page"
中间iframe没有任何变化??
我是一个Ext.ContentPanel('center',{
id:'ss'
},<iframe id="test" src="'+UrlText+'" width="100%" height="400" frameborder="0" scrolling="auto"></iframe>);
这样能出来,不过我点左边菜单,用Ext.get("youID").src="you page" 没有任何变化。。。。
6 楼 heweiya 2008-03-27  
引用
Ext.get("youID").src="you page"

这样应该就可以了。

    帮助作者补充一点,其实要加一个前提,如果要使用HTML嵌入Iframe,就需要把他的ID写出来,上面的写法应该是:
   funtab.add({  
                      title:titleText ,  
                      id:'tab_'+id,  
                      iconCls: 'tabs',                    
                      margins:'0 4 4 0',  
                      autoHeight:true,  
                      autoScroll:true,  
                      autoWidth:true,  
                      closable:true,  
                     frame:true,  
                     html:'<iframe id="test" src="'+UrlText+'" width="100%" height="400" frameborder="0" scrolling="auto"></iframe>'  
  12.             }).show();  

你才可以使用:Ext.get("youID").src="you page"
5 楼 pipashu 2008-03-24  
引用 http://www.iteye.com/topic/175391
有了IFrame 后,IFrame如何自适应大小呢?即如何获得窗口大小调整事件呢?

-----------------------------------------------------------
更多相关推荐 构造左右两个部分的一个界面,我希望在左边放入一个IFrame,为了使IFrame自适应拖动后窗口的大小,需要截获左右窗口大小调整事件(鼠标拖动当中的边框),我花了半天多时间,查了好多资料,到现在还没有任何头绪。谁能有什么思路,快帮帮忙啊,万分谢谢,万分谢谢。

{
layout:"border",
items:[{
region:"center"
},{
region:"west",
title:"左边",
width:200,
split:true,
collapsible:true,
hlDrop:true
}]
}
4 楼 gdipkf1986 2008-03-07  
Ext.get("youID").src="you page"

这样应该就可以了。


用iframe确实很好很强大....重复加载的问题楼主考虑过没有?加载十个页面,如果十个页面都有用到Ext的功能,那不是十个页面都要重新加载一次ext-all.js,ext-all.css....很恐怖的一个基数。直接用Ext加载内容没有重复加载的情况发生。
3 楼 xiang588 2008-03-07  
我也是这样做的
不过遇到个问题
如何改变iframe的src的值

相关推荐

    extjs4.2.1 tabPanel刷新及关闭标签

    除了关闭当前标签页之外,有时还需要实现关闭其他所有标签页的功能,这可以通过遍历`TabPanel`的所有子项并逐一判断是否为当前激活的标签页来实现: ```javascript onCloseOthers: function() { // 获取当前激活的...

    ExtJs部署及使用方法

    var mainPanel = new Ext.TabPanel({ id: "main", title: "", region: "center", // 布局区域为center deferredRender: false, enableTabScroll: true, // 允许滚动显示tab activeTab: 0, autoDestroy: false...

    jQuery模仿ExtJS之TabPanel最新

    TabPanel(选项卡组件) 参数说明 renderTo| jQuery object | NULL&gt; 渲染到某容器 将选项卡组件渲染到某容器,参数类型可以为字符串,也可以为jQuery所加载的对象,如果为声明该参数,组件默认的承载容器为BODY。 ...

    ExtJs使用IFrame的实现代码

    在ExtJs中实现Iframe的嵌入功能,主要目的是为了在Web应用中集成外部页面或报表内容。ExtJs是一个用于开发富互联网应用的JavaScript库,它提供了强大的界面组件和数据处理机制。而Iframe(内联框架)标签是HTML的一...

    jquery资料 大全

    5. TabPanel(选项卡组件):模仿EXT的TabPanel,提供灵活的选项卡管理功能,包括设置渲染位置、宽度、高度、边框样式、默认激活项以及动态添加、删除和操作选项卡。 二、选项卡组件(TabPanel)参数详解: - ...

    Ext制作的教务管理系统[源码+数据库+说明]

    4.单击节点访问页面时,在主界面TabPanel新增一个Panel,Panel下放置一个iframe,将要链 接的页面放入iframe中。 5.grid数据加载,分页,编辑删除。 6.用户列表页面点编辑时,在父页面的TabPanel中增加一个标签,下...

    Extjs中TabPane如何嵌套在其他网页中实现思路及代码

    var tabPanel = new Ext.TabPanel({ activeTab: 0, // 激活第一个Tab region: 'center', // 将TabPanel放置在中央区域 layoutOnTabChange: false, // 是否在切换Tab时重新布局 deferredRender: true, // 延迟...

    1000多个jquery常用插件.pdf

    - **主要功能:**通过简单的代码即可实现水平方向上的菜单折叠效果,操作简单快捷。 ##### (2) jQuery-HorizontalAccordion **特点与应用:** - **界面风格:**具有XBOX 360 blade界面风格,给人一种科技感十足的...

    JAVA编程规范

    `parent.Ext` 和 `top.Ext` 分别代表了 iframe 外部的 Ext 库实例,通过它们可以访问到外部环境中的 Ext 组件。 3. **函数定义** ```javascript function() { // 函数体 } ``` 在 JavaScript 中,所有的...

    1000个jquery插件说明(doc文档)

    5. **TabPanel (模仿EXT的Tab选项卡)**:TabPanel插件用于实现类似EXT库的选项卡组件,可以轻松创建带有多个面板的界面,每个面板代表一个选项卡。它提供了丰富的配置选项,如渲染位置、尺寸、边框显示、默认激活的...

Global site tag (gtag.js) - Google Analytics