easyui动态tabs，使用iframe高度显示异常

盜令玊 2015-11-03 08:43:53

easyui动态加载tabs，加载页放在iframe框架中，iframe设置了width:100%;height:100%，在加载后iframe高度没有100%，滚动条能正常使用，点击切换一下easyui-tabs页显示后高度又能正常显示100%，在chrome、safari下测试有这个情况，在firefox下测试能直接100%高度显示，这个问题应该怎么解决？？？
附动态加载tabs代码



                //加载一个tab页

                var newcase='<iframe scrolling="auto" frameborder="0" id="'+data.id+'" src="case.html?caseid='+data.id+'" style="width:100%;height:100%;"></iframe>';

                //console.log(newdiv);

                $('#detailtabs').tabs('add',{

                    title:data.ajmc,

                    content:newcase,

                    closable:true

                });

...全文

247 2 打赏收藏转发到动态举报

写回复

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

斯洛文尼亚旅游 2015-11-04

打赏
举报

回复

onload事件中自己获取父容器高度设置下height属性就好了，不用100%来定高

盜令玊 2015-11-03

打赏
举报

回复

没人来回答……是CSDN缺乏人气吗？？？？？自己用本办法解决了，在iframe增加了onload事件，事件中多做一个tabs页的切换动作来解决这个问题

解决使用tab布局过程中页面多次加载的问题如果在使用easyui过程中,你使用了easyui 的tab布局,在tab布局的内容上使用的不是content,而是iframe,那么你的页面有可能多次加载了,这篇文章帮你解决问题

关闭easyui的tabs释放iframe的内存，

EasyUi tabs的高度与宽度根据IE窗口的变化自适应代码,需要的朋友可以参考下。

本文实例讲述了jQuery插件EasyUI获取当前Tab中iframe窗体对象的方法。分享给大家供大家参考，具体如下：我们在使用EasyUI Tabs框架时，在框架最顶层的弹出窗体中需要操作当前Tab的iframe窗体内容或方法，这时候我们就可以使用以下方法来实现。具体实现代码如下所示： function getTabWindow() { var curTabWin = null; var curTab = parent.$('#main-center').tabs('getSelected'); if (curTab && curTab.find('iframe').len

2016-1-31 更新 1、使用时不再需要显示调用followCustomHandle方法，即可生效扩展属性。 2013-9-3 更新 1、$.showWindow 和 $.showModalDialog 在useiframe=true时，对窗体body增加遮罩控制。 2、easyui.tabs的add方法当useiframe=true时，增加遮罩控制。 3、toolbar增加url属性，可以通过请求后台数据构建。 4、增加mask（遮罩）扩展。 2013-8-26 更新 1、tree增加支持类标准数据格式加载，具体看demo或jquery.easyui.tree.extend.js文件开头说明。 2、修复datagrid在rowediting编辑风格时点击“确定”按钮无法提交问题。 3、datagrid和treegrid增加getEditingRows方法，用来获取所有正在编辑的行。 4、修复tabs.add方法，当useiframe=true时, iframe的高度改为100%。 5、修复当tabs使用iframe时，右键菜单刷新报错问题。 6、增加combotree对简单数据格式和类标准数据格式的加载，具体参考jquery.easyui.tree.extend.js文件开头说明。 7、修复datagrid.onConfirmEdit事件默认实现bug。 8、增加treegrid.onConfirmEdit事件。 2013-8-12 更新 1、修复combobox在级联操作时，传递的swd参数值为null，而不是选中值。 2、datagrid的addEventListener 方法增加对事件onExpandRow和onCollapseRow的控制。 3、tree增加自定义属性 attributes，用于简单数据加载时，指定那些字段当作node的attributes属性使用。 4、combobox增加 getSelected 方法，返回选中item的data值。 5、combogrid增加 getSelected 方法，返回选中item的data值。 6、datagrid增加 getAllExpandRowIndex 方法，用于在detailView视图下获取当前页已展开行的索引。 7、datagrid增加 getExpandRowIndex 方法，用于在detailView视图下获取当前页第一个展开行的索引。 8、datagrid增加 fixDetailRowWidth 方法，用于detailView视图下修改rowDetial中组件宽度。 9、getAllExpandRowIndex、getExpandRowIndex、fixDetailRowWidth 这三个方法联合使用可解决detailView视图下列拖拽时显示错位问题。 10、修复datagrid 的rowEditing编辑风格在没有数据的datagrid中增加数据后，再编辑时无法显示的问题。 11、datagrid增加自定义事件 onConfirmEdit , 用于rowEditing编辑风格点击“确定”按钮时触发。当事件返回false时终止endEdit方法调用。 2013-7-31 更新 1、$.showWindow、$.showModalDialog 这两个方法增加返回值，返回值指向当前弹出窗的引用。 2、移除根据$.browser.msie判断浏览器版本。 2013-7-18 更新 1、menu、datagrid、combo、combobox、panel、tabs、tree、treegrid 增加 addEventListener 方法。 2、修复menu、datagrid、combo、combobox、panel、tabs、tree、treegrid 因事件注册造成多次重复渲染的问题（包括多次请求后台数据）。 3、移除datagrid 的rowContextMenu菜单项默认事件替换功能。 4、删除datagrid rowContextMenu默认菜单中的增加、编辑、导出菜单项。

87,997

社区成员

224,708

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章