点击easyui子页面中的按钮，在父页面中增加显示tabs

最新推荐文章于 2022-05-05 23:10:18 发布

桔梗花语啊

最新推荐文章于 2022-05-05 23:10:18 发布

阅读量5.7k

点赞数 1

CC 4.0 BY-SA版权

文章标签： easyui tabs 子页面 J2EE HTML

本文链接：https://blog.youkuaiyun.com/u013479571/article/details/50754805

本文介绍如何在EasyUI框架中从子页面向父页面动态添加Tab。通过利用window.parent获取父窗口并使用jQuery操作tabs组件，实现了一级菜单的动态加载功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

我们在使用easyui开发后台管理系统时，常常easyui tree和tab会结合使用。通常情况下，点击同一级的某个链接弹出tab非常简单，如：点击tree的某一个节点（红色箭头所指），会在内容区域显示数据列表的内容。

但在很多情况下，我们需要做的是点击easyui子页面中的按钮，在父页面中增加显示tabs的内容，这时怎么操作呢？

我的思路是首先根据子页面获取父页面内容，如window.parent，然后再获取父页面中的id为tabs的控件，接着就可以实现添加tab了，具体代码如下：

var jq = top.jQuery;

if (jq("#tabs").tabs('exists', '一级菜单4')){
    jq("#tabs").tabs('select','一级菜单4');
} else {
    var content = '<iframe scrolling="auto" frameborder="0"  src="http://www.baidu.com" style="width:100%;height:100%;"></iframe>';
    jq("#tabs").tabs('add',{
        title:'一级菜单4',
        content:content,
        closable:true
    });
}

效果如下: