自己工作中在遇到的问题,只是自己记录,只是部分代码,可能你也遇到类似问题,虽然表述不是很严谨周到,类似问题可以参考下。
function addTab(subtitle, url, icon, id) { //增加选项卡函数
if (!$('#tabs').tabs('exists', subtitle)) {
$('#tabs').tabs('add', {
title : subtitle,
content : createFrame(id,url), //选项卡内容参数,用的是函数返回值,函数定义在下面
closable : true,
icon : icon
});
} else {
$('#tabs').tabs('select', subtitle);
// 刷新
// $('#mm-tabupdate').click();
}
curtab = subtitle;
tabClose();
}
function createFrame(id, url) {
var s = '<iframe id="' + id + '" scrolling="auto" frameborder="0" src='
+ url + ' " style="100%;height:100%;"></iframe>';
return s;
}//该函数拼接了字符串并其返回作为content 值
一、自己初步理解的是 content 内容是string格式的, 要更改选项卡的内容需更改函数定义,内部定义实现将目标内容转换为字符串然后将其返回。
(后来测试过 content 内容可以为 number值,正常显示,object值不显示不报错,array报错)
测试函数
function aa(){//失败方法
//tab 主体结构下 添加了静态Html <div id="aa" style=""><table style="height:300px" class="tt"></table></div> 用以创建datagrid
$('.tt').datagrid(obj);
var s=$("#aa").get(0).innerHTML;
return s;
}//问题是 只有第一次点击树形菜单生效,原因是静态结构只能使用一次,第一次点击菜单节点可以使用
//第二次点击菜单节点不能访问了
---------原因暂时不详
二、换思路了 先把 Html <div id="aa" style=""><table style="height:300px" class="tt"></table></div> 动态添加到Tab上 然后再回调中再在已有结构中创建datagrid。
function bb(){
// var s = ' <div id="aa" style=""><table style="height:300px" id="tt"></table></div>';
//不能用id id唯一 多个选项卡之间id 会冲突 改为class名就好了
var ss = ' <div id="aa" style=""><table style="height:300px" class="tt"></table></div>';
return ss;
}
回调函数中
addTab(treeNode.name, treeNode.action_url, "", treeNode.id);
$(".tt").datagrid(obj);//在添加Tab卡之后加上一句 创建 datagrid。
解决了 content 配置问题。