easyui 在子tab页中打开新tab页(关于easyUI在子页面增加显示tabs的一个问题)
2017-05-25 09:41
274 查看
在父页面点个链接能动态看到子页面的情况太简单,请看easyUI官网:http://www.jeasyui.com/tutorial/layout/tabs2.PHP
现在说的是在子页面点个按钮也能触发增加子页面的情况。
情景是,在父页面上有个div如:
<div class="easyui-tabs" id="main" fit="true" border="false">
<div title="Welcome" iconCls="icon-page" style="padding:20px;overflow:hidden;">
</div>
</div>
在子页面上有个
Html代码
<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怎么写。
直接这样写是不行的:
Js代码
function testAddSubPage(title,url){
var parentMain = window.parent.document.getElementById("main");
var $main = $(parentMain);
var content = '<iframe scrolling="auto" frameborder="0" src="'+url+'" style="width:100%;height:100%;"></iframe>';
$main.tabs('add',{
title:title,
content:content,
closable:true
}
);
}
这里虽然可以取到父页面那个id为main的div对象,但是把这个dom对象转化为jQuery对象$main之后,$main.tabs('add',{...})这个方法死法报错不能通过。
改正的关键是用top.jQuery这个函数,这个函数具体出外我忘记了,用法看似是取得整个父页面对象,正确是写法:
Java代码
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+'" style="width:100%;height:100%;"></iframe>';
jq("#main").tabs('add',{
title:title,
content:content,
closable:true
});
}
}
现在说的是在子页面点个按钮也能触发增加子页面的情况。
情景是,在父页面上有个div如:
<div class="easyui-tabs" id="main" fit="true" border="false">
<div title="Welcome" iconCls="icon-page" style="padding:20px;overflow:hidden;">
</div>
</div>
在子页面上有个
Html代码
<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怎么写。
直接这样写是不行的:
Js代码
function testAddSubPage(title,url){
var parentMain = window.parent.document.getElementById("main");
var $main = $(parentMain);
var content = '<iframe scrolling="auto" frameborder="0" src="'+url+'" style="width:100%;height:100%;"></iframe>';
$main.tabs('add',{
title:title,
content:content,
closable:true
}
);
}
这里虽然可以取到父页面那个id为main的div对象,但是把这个dom对象转化为jQuery对象$main之后,$main.tabs('add',{...})这个方法死法报错不能通过。
改正的关键是用top.jQuery这个函数,这个函数具体出外我忘记了,用法看似是取得整个父页面对象,正确是写法:
Java代码
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+'" style="width:100%;height:100%;"></iframe>';
jq("#main").tabs('add',{
title:title,
content:content,
closable:true
});
}
}
相关文章推荐
- jquery easyui 在子tab页中打开新tab页(关于easyUI在子页面增加显示tabs的一个问题)
- jquery easyui 在子tab页中打开新tab页(关于easyUI在子页面增加显示tabs的一个问题)
- easyui 在子tabs中打开新tabs(关于easyUI在子页面增加显示tabs的一个问题)
- 关于easyUI在子页面增加显示tabs的一个问题
- 关于easyUI在子页面增加显示tabs的一个问题
- 关于easyUI在子页面增加显示tabs的一个问题
- 关于easyUI 的tabs 在子页面增加显示tabs的一个问题
- 关于easyUI在子页面增加显示tabs的一个问题
- EasyUI-子页面增加显示tabs的一个问题
- 关于手机端显示页面一个像素的边框变粗的问题
- 测试在discuz后台增加一个只能用admin用户打开的管理页面,仅显示aaa三个字母
- 关于打开页面显示popwindow报错的问题
- 关于下载xbmc后打开Android 源码时的一个思考问题?兼各平台安装xbmc 的中文显示
- 无法打开多维数据集(使用Dundas的OLAP显示控件时的一个小的问题)
- 关于在一个页面中包含15个几以上flash mp3 players时,在非IE下播放不正常的问题和解决方案
- 关于UIBotton的高亮显示图片的一个小问题
- ActiveReport的ActiveX模式下,打开页面后,控件不显示内容,右上角扫描的动画显示在读取什么的问题
- 问一个关于生成静态页面的问题
- 一个jsp页面显示的中文问题
- 终于解决了一个困扰我许久的问题:通过window.showModalDialog打开的页面,Form提交,标题丢失