文档章节

取到easyui的tab下iframe方法

文文1
 文文1
发布于 2015/03/26 13:58
字数 301
阅读 567
收藏 1

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

tab的html如下:

Html代码:

<div id="tab-user-right" >   
        <div title="直接分配的操作权限" id="user-right-act">             
            <iframe scrolling="yes" frameborder="0" height="500" width="100%"  frameborder="0" ></iframe>  
        </div>  
        <div title="拥有的角色" id="user-role">              
            <iframe scrolling="yes" frameborder="0" height="500" width="100%"  frameborder="0" ></iframe>  
        </div>  
        <div title="继承自角色的权限" id="user-right-role">             
            <iframe scrolling="yes" frameborder="0" height="500" width="100%"  frameborder="0" ></iframe>  
        </div>  
        <div title="全部操作权限" id="user-right-all">            
            <iframe scrolling="yes" frameborder="0" height="500" width="100%"  frameborder="0" ></iframe>  
        </div>  
        <div title="数据权限-机构" id="user-right-org">           
            <iframe scrolling="yes" frameborder="0" height="500" width="100%"  frameborder="0" ></iframe>  
        </div>  
        <div title="数据权限-部门" id="user-right-dept">              
            <iframe scrolling="yes" frameborder="0" height="500" width="100%"  frameborder="0" ></iframe>  
        </div>  
    </div>

动态刷新的js如下:

//标记是否从新刷新  
        var reload="T";  
        $(function(){  
            $('#tab-user-right').tabs({   
                onSelect: function(){  
                    openTab();                                        
                }  
            });  
        });  
          
        function openTab(){           
            var tab = $('#tab-user-right').tabs('getSelected');  
            var tbId = tab.attr("id");  
            //获取tab的iframe对象  
            var tbIframe = $("#"+tbId+" iframe:first-child");  
            if(reload=="T"){                  
                tbIframe.attr("src",tbId+'.action?userId='+userId);  
            }else{        
                if( tbIframe.attr("src")==""){  
                  tbIframe.attr("src",tbId+'.action?userId='+userId);  
                }  
            }  
        }

注意一下代码:

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"); 




© 著作权归作者所有

共有 人打赏支持
文文1
粉丝 21
博文 351
码字总数 117723
作品 0
长沙
程序员
jquery easyui tab加载内容的几种方法

两者特点: href方式加载数据的特点: 被加载的页面只有body元素内部的内容才会被加载,也就是jQuery的ajax请求的只是html片段。 加载远程url时有遮罩效果,也就是“等待中……”效果,用户体...

文文1
2015/03/26
0
0
JQuery EasyUi之界面设计——前言与界面效果(一)

如果冯巩的开场白是“观众朋友们,我想死你们了”,那么我的开场白是“最近一直很忙,很久没有发文了”。 前面说过了EXT.NET,这里顺便再说说JQuery EasyUI。为啥我会选择JQuery EasyUI呢?主...

易水寒丶开源
2015/10/27
0
0
Easy-UI中datagrid宽高自适应问题

在使用easy-ui的过程中,新增tab中利用iframe显示时,发现里面的datagrid高度不能自适应,下面是解决办法,写下备用: 再iframe中使用easyui-layout布局,然后把datagrid放到center就可以了,...

独-奏
2013/02/16
0
1
easyui弹出框全局遮罩的实现

用EasyUI做一个管理系统,左边导航栏,右边主区域TAB,tab里面嵌入一个iframe。然后所有的操作都到iframe里面了。在iframe里面引入datagrid,搞个工具栏,弹出框啊什么的都只能遮罩住iframe的...

mk_believe
2015/11/04
0
1
关于EasyUI使用tree方法生成树形结构加载两次的问题

html代码中利用class声明了easyui-tree,导致easyUI解析class代码的时候先解析class声明中的easyui-tree这样组件就请求了一次url;然后又调用js初始化代码请求一次url。这样导致了重复加载,解...

Doublec
2015/04/21
0
0

没有更多内容

加载失败,请刷新页面

加载更多

用户体验要素——以用户为设计中心

一、用户体验是什么 产品会与外界发生联系,人们如何去使用产品,人们使用产品无非解决两种问题,一,提高效率;二娱乐。而用户体验兼顾着功能和界面两个方面,为的是“提高人们的工作效率”...

铸剑为犁413
56分钟前
0
0
学习设计模式——代理模式

1. 认识代理模式 1. 定义:为其他对象提供一种代理以控制对这个对象的访问。 2. 组织结构: Proxy:代理对象,要实现与目标代理对象的相同的接口,这样就可以使用代理来代替具体的目标对象,...

江左煤郎
今天
1
0
java JDK动态代理

本篇随笔是对java动态代理中的JDK代理方式的具体实现。 首先需要定义一个接口,为其定义了两个方法:   public interface UserService { public void add(); public void delete(); } 然后需...

编程SHA
今天
2
0
轻松理解Dubbo分布式服务框架

Dubbo是什么? Dubbo是一个分布式服务框架,致力于提供高性能和透明化的RPC远程服务调用方案,以及SOA服务治理方案。简单的说,dubbo就是个服务框架,如果没有分布式的需求,其实是不需要用的...

别打我会飞
今天
3
0
TypeScript基础入门之JSX(一)

转发 TypeScript基础入门之JSX(一) 介绍 JSX是一种可嵌入的类似XML的语法。 它旨在转换为有效的JavaScript,尽管该转换的语义是特定于实现的。 JSX在React框架中越来越受欢迎,但此后也看到了...

durban
今天
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部