easyui 在子tabs中打开新tabs(关于easyUI在子页面增加显示tabs的一个问题)

2024-10-21 14:19:30

现在说的是在子页面点个按钮也能触发增加子页面的情况。情景是，在父页面上有个div如：

<div class="easyui-tabs" id="main" fit="true" border="false">
　　<div title="Welcome" iconCls="icon-page" style="padding:20px;overflow:hidden;">
　　</div>
</div>

在子页面上有个

<a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="testAddSubPage('new tab','http://www.baidu.com')">test add subpage</a>

现在想点这个链接能弹出一个新的tab，tab里面的内容是百度主页。关键的问题来了，就是testAddSubPage这个function怎么写。

直接这样写是不行的：

function testAddSubPage(title,url){
var parentMain = window.parent.document.getElementById("main");
var $main = $(parentMain);
var content = '<iframe scrolling="auto" frameborder="0" src="'+url+'" ></iframe>';
$main.tabs('add',{
title:title,
content:content,
closable:true
}
);
}

这里虽然可以取到父页面那个id为main的div对象，但是把这个dom对象转化为jQuery对象$main之后，$main.tabs('add',{...})这个方法死法报错不能通过。

改正的关键是用top.jQuery这个函数，这个函数具体出外我忘记了，用法看似是取得整个父页面对象，正确是写法：

function testAddSubPage(title,url){
var jq = top.jQuery;
if (jq("#main").tabs('exists', title)){
jq("#main").tabs('select', title);
} else {
var content = '<iframe scrolling="auto" frameborder="0" src="'+url+'" ></iframe>';
jq("#main").tabs('add',{
title:title,
content:content,
closable:true
});
}
}

最新文章

热门文章