`
zzc1684
  • 浏览: 1224418 次
  • 性别: Icon_minigender_1
  • 来自: 广州
文章分类
社区版块
存档分类
最新评论

EasyUI 添加tab页(iframe方式)

阅读更多

添加一个新的tab,全部以iframe的形式来加载

 

    function addTab(title, href,icon){  
        var tt = $('#tabs');  
        if (tt.tabs('exists', title)){//如果tab已经存在,则选中并刷新该tab          
            tt.tabs('select', title);  
            refreshTab({tabTitle:title,url:href});  
        } else {  
            if (href){  
                var content = '<iframe scrolling="no" frameborder="0"  src="'+href+'" style="width:100%;height:100%;"></iframe>';  
            } else {  
                var content = '未实现';  
            }  
            tt.tabs('add',{  
                title:title,  
                closable:true,  
                content:content,  
                iconCls:icon||'icon-default'  
            });  
        }  
    }  
    /**     
     * 刷新tab 
     * @cfg  
     *example: {tabTitle:'tabTitle',url:'refreshUrl'} 
     *如果tabTitle为空,则默认刷新当前选中的tab 
     *如果url为空,则默认以原来的url进行reload 
     */  
    function refreshTab(cfg){  
        var refresh_tab = cfg.tabTitle?$('#tabs').tabs('getTab',cfg.tabTitle):$('#tabs').tabs('getSelected');  
        if(refresh_tab && refresh_tab.find('iframe').length > 0){  
        var _refresh_ifram = refresh_tab.find('iframe')[0];  
        var refresh_url = cfg.url?cfg.url:_refresh_ifram.src;  
        //_refresh_ifram.src = refresh_url;  
        _refresh_ifram.contentWindow.location.href=refresh_url;  
        }  
    }  

 

分享到:
评论

相关推荐

    关闭easyui 的tab 释放iframe的内存

    这种方式虽然方便,但也带来了一个问题:当用户关闭某个标签页后,其对应的`&lt;iframe&gt;`及其内部资源并未被及时清理或释放,导致浏览器内存逐渐累积,最终可能导致浏览器卡顿甚至崩溃。 #### 问题分析 默认情况下,当...

    easyui iframe 页面重复加载的问题

    easyui的tab组件允许开发者在页面中以标签页的方式组织内容,每个标签页对应一个页面片段。一般情况下,这些页面片段是直接作为HTML内容存在,通过Ajax动态获取,或者通过easyui的content方法加载。但当使用iframe...

    jQuery插件EasyUI获取当前Tab中iframe窗体对象的方法

    本文实例讲述了jQuery插件EasyUI获取当前Tab中iframe窗体对象的方法。分享给大家供大家参考,具体如下: 我们在使用EasyUI Tabs框架时,在框架最顶层的弹出窗体中需要操作当前Tab的iframe窗体内容或方法,这时候我们...

    实例代码讲解jquery easyui动态tab页

    本文将深入讲解如何使用 jQuery EasyUI 动态添加和刷新 Tab 页面。 首先,添加一个新的 Tab 页面主要通过调用 `tabs('add')` 方法来实现。在提供的代码示例中,`addTab` 函数接收三个参数:`title`(标签页标题)、...

    如何解决jQuery EasyUI 已打开Tab重新加载问题

    需要注意的是,`iframe`方式加载内容可能导致页面之间的交互变得复杂,因为每个Tab实际上是一个独立的页面。同时,由于跨域限制,`iframe`可能无法访问父页面或者被父页面访问,这取决于你的应用环境和安全策略。 ...

    关于jQuery EasyUI 中刷新Tab选项卡后一个页面变形的解决方法

    在使用jQuery EasyUI框架开发中,Tab选项卡组件是常用的一个组件,它允许用户在一个页面上通过选项卡切换不同的内容区域。但是在某些情况下,例如在实现选项卡内容的动态刷新时,可能会遇到页面布局变形的问题。 ...

    jQuery EasyUI Tab 选项卡问题小结

    jQuery EasyUI 是一个基于 jQuery 的前端框架,它提供了一系列组件,包括 Tab 选项卡,用于构建用户界面。本文将深入探讨在使用 jQuery EasyUI Tab 选项卡时可能会遇到的问题及其解决方案。 首先,让我们理解基本的...

    easyui页面布局示例

    首先,EasyUI 提供了多种布局模式,如网格布局(grid layout)、面板布局(panel layout)、窗口布局(window layout)等,这些布局方式可以帮助开发者灵活地组织页面元素。在本示例中,很可能是使用了网格布局来...

    为EasyUI的Tab标签添加右键菜单的方法

    在本文中,我们将深入探讨如何为EasyUI的Tab标签添加右键菜单,这是一个对于提升用户体验非常实用的功能。EasyUI是一个基于jQuery的UI框架,它提供了一系列组件来帮助开发者快速构建美观的Web应用。在之前的实现中,...

    Easyui 去除jquery-easui tab页div自带滚动条的方法

    这个问题通常出现在当我们需要在一个Tab页内嵌入一个iframe页面时,由于内容过多,导致Tab页本身也出现了滚动条,而我们只希望iframe页面自身显示滚动条。 首先,我们要理解EasyUI的Tab组件结构。EasyUI的Tab是由多...

    easyui简单的增删改查范例

    4. 创建Tab页内容:Tab页内容是通过iframe加载的,这在easyui中是常见的方式,可以快速嵌入其他页面或者远程内容。不过这种做法在现代Web开发中已不太推荐,因为iframe存在跨域限制、影响SEO、性能问题等。 这个...

    Easyui 关闭jquery-easui tab标签页前触发事件的解决方法

    在使用Easyui,一个基于jQuery的用户界面库,特别是与jQuery-easui插件一起工作时,有时我们需要在用户尝试关闭某个tab标签页之前执行某些操作,比如进行数据验证或检查特定条件。本文将深入探讨如何实现这个功能,...

    jQuery EasyUI 布局之动态添加tabs标签页

    总结起来,动态添加 jQuery EasyUI 的 tabs 标签页主要涉及以下步骤: 1. 创建 HTML 结构,包括按钮和 tabs 容器。 2. 编写 `addTab` 函数,处理添加新 tab 的逻辑,包括检查是否存在和添加新 tab。 3. 使用 iframe ...

    JqueryEasyU页面布局。左边导航,上面tabs.都已经集成好了。

    这涉及到对`easyui-tabs`的API的熟练运用,例如`tabs('add', {title: '新标签', content: '新内容', closable: true})`来添加一个新的可关闭的Tab页。 至于 **标签** ,这里提到了 "jQuery easyui java jsp"。这...

    基于Jquery easyui 选中特定的tab

    为了在页面加载时就让特定的tab处于选中状态,可以通过编程方式实现。下面的代码段展示了如何使用update方法来设置特定tab为选中状态: ```javascript $('#tt').tabs('update', { tab: $('#tt').tabs('getTab', '...

Global site tag (gtag.js) - Google Analytics