取到easyui的tab下iframe方法

转载 2015年07月07日 09:24:34

我们在使用easyui的tab时,有时候需要每次点击tab头,动态刷新该tab下的iframe的内容

tab的html如下:

 

Html代码  收藏代码
  1. <div id="tab-user-right" >   
  2.         <div title="直接分配的操作权限" id="user-right-act">             
  3.             <iframe scrolling="yes" frameborder="0" height="500" width="100%"  frameborder="0" ></iframe>  
  4.         </div>  
  5.         <div title="拥有的角色" id="user-role">              
  6.             <iframe scrolling="yes" frameborder="0" height="500" width="100%"  frameborder="0" ></iframe>  
  7.         </div>  
  8.         <div title="继承自角色的权限" id="user-right-role">             
  9.             <iframe scrolling="yes" frameborder="0" height="500" width="100%"  frameborder="0" ></iframe>  
  10.         </div>  
  11.         <div title="全部操作权限" id="user-right-all">            
  12.             <iframe scrolling="yes" frameborder="0" height="500" width="100%"  frameborder="0" ></iframe>  
  13.         </div>  
  14.         <div title="数据权限-机构" id="user-right-org">           
  15.             <iframe scrolling="yes" frameborder="0" height="500" width="100%"  frameborder="0" ></iframe>  
  16.         </div>  
  17.         <div title="数据权限-部门" id="user-right-dept">              
  18.             <iframe scrolling="yes" frameborder="0" height="500" width="100%"  frameborder="0" ></iframe>  
  19.         </div>  
  20.     </div>  

 动态刷新的js如下:

Js代码  收藏代码
  1. //标记是否从新刷新  
  2.         var reload="T";  
  3.         $(function(){  
  4.             $('#tab-user-right').tabs({   
  5.                 onSelect: function(){  
  6.                     openTab();                                        
  7.                 }  
  8.             });  
  9.         });  
  10.           
  11.         function openTab(){           
  12.             var tab = $('#tab-user-right').tabs('getSelected');  
  13.             var tbId = tab.attr("id");  
  14.             //获取tab的iframe对象  
  15.             var tbIframe = $("#"+tbId+" iframe:first-child");  
  16.             if(reload=="T"){                  
  17.                 tbIframe.attr("src",tbId+'.action?userId='+userId);  
  18.             }else{        
  19.                 if( tbIframe.attr("src")==""){  
  20.                   tbIframe.attr("src",tbId+'.action?userId='+userId);  
  21.                 }  
  22.             }  
  23.         }  

 注意一下代码:

Js代码  收藏代码
  1. var tab = $('#tab-user-right').tabs('getSelected');  
  2.             var tbId = tab.attr("id");  
  3.             //获取tab的iframe对象  
  4.             var tbIframe = $("#"+tbId+" iframe:first-child");  

 可以获得iframe

easyUI的iframe子页面操作父页面元素

曾经试过这样的方法       在iframe子页面获取父页面元素       代码如下:       $('#objId', parent.document); 这样可以获得...
  • hb0746
  • hb0746
  • 2014年10月22日 16:03
  • 4713

JQuery中easyui获取tab页对象以及获取获取tab页对象下的iframe对象跟指定tab页对象隐藏

JQuery中easyui获取tab页对象以及获取获取tab页对象下的iframe对象和指定tab页对象隐藏 $('#mytabs').tabs( {   onSelect : function(...
  • cx136295988
  • cx136295988
  • 2016年11月09日 12:56
  • 2519

easyui主界面布局easyui-layout用法一例

easyui主界面布局easyui-layout用法一例 例一:              style="padding:0 0 0 0; overflow:hidden; height:...
  • hsg77
  • hsg77
  • 2016年06月03日 14:57
  • 5361

使用tree的左边菜单+多iframe实现的tab 实战

项目需要使用到了iframe,这里做个笔记摘要,日后温习。     addShortMenuContentDiv这个iframe里的页面js操作iframe(38contentDiv)里的dom元素,...
  • weiweiai123456
  • weiweiai123456
  • 2015年03月24日 10:52
  • 4866

Easyui - 利用iframe打开tab以及在iframe打开父tab

此处介绍利用iframe打开tab(先上方法) /** * 在iFrame中打开一个新tab * @param title * @param href */ function openTab(...
  • yangligao_
  • yangligao_
  • 2015年08月12日 17:29
  • 7287

EasyUI两种动态添加tab Iframe页面的方法

/** 动态添加tab-----方式一 **/ function addIframeTab(titleTxt,href,icon) { $('#mytabs').ta...
  • songkexin
  • songkexin
  • 2016年03月24日 10:51
  • 10275

Jquery EasyUI 弹出div对话框引入其他页面(iframe)

在jquery easyui官方下载最新版demo1.4.4。。 引用 //url:窗口调用地址,title:窗口标题,width:宽度,height:高度,shadow:...
  • hr541659660
  • hr541659660
  • 2015年12月17日 14:59
  • 9530

jquery easyui Tab 引入页面的问题

jQuery Easyui 的tabs插件有两种方式加载某个tab(标签页)上的内容:“href远程请求”和“content本地内容”,本文就两种方式的优缺点进行简单分析和思考。 两者特点: hr...
  • superdog007
  • superdog007
  • 2012年11月26日 13:55
  • 17239

解决easyui-tabs中使用iframe时出现两个垂直滚动条

最近在使用easyui-tabs加iframe时,出现了两个垂直滚动条的现象,如下图所示 前端代码如下:...
  • zhlantian
  • zhlantian
  • 2017年04月19日 15:27
  • 2984

EasyUI tab加载iframe高度不适应

在使用tab时用iframe主要是因为tab的href加载的是html片段,即时对应链接页面的body的内容,像在body外css和js等其他资源不会被加载到的。同时,在tab切换的时候可能会引起da...
  • qq_23311211
  • qq_23311211
  • 2017年03月15日 16:14
  • 1222
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:取到easyui的tab下iframe方法
举报原因:
原因补充:

(最多只允许输入30个字)