页面1：table.html
<body>
<!-- 表格工具栏 -->
<div id="tb">
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-remove'" onclick="del()">删除</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit'">修改</a>
<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add'">增加</a>
</div>
<table id="dd" style="width:600px" class="easyui-datagrid" data-options="url:'datagrid.json',
pagination:true,singleSelect:true,remoteSort:false,toolbar:'#tb'"><!--表格加载工具栏-->
<thead>
<tr>
<th data-options="field:'code'" style="width:200px">编号</th>
<th data-options="field:'name'" style="width:200px">名称</th>
<th data-options="field:'price'" style="width:200px">价格</th>
</tr>
</thead>
</table>
</body>
页面2：index.html
<script type="text/javascript">
$(function(){
//树
var i=0;
$('#tree').tree({
url:'tree.json',
onClick:function(node){
if(node.text.indexOf('管理')<0){
var tab=$('#tabs').tabs('exists',node.text)//树当前选项的选项卡
if(!tab){
//如果不存在 就新建选项卡
$('#tabs').tabs('add',{
id:i++,
title:node.text,
closable:true,
"href":'table.html',//引入table.html页面
cache:false
})
}
}
}
})
})
<body class="easyui-layout">
<div data-options="region:'north',title:'North Title',split:true" style="height:100px;">
<h1 style="text-align:center">欢迎来到后台管理系统</h1>
</div>
<div data-options="region:'south',title:'South Title',split:true" style="height:100px;"></div>
<div data-options="region:'east',iconCls:'icon-reload',title:'East',split:true" style="width:100px;"></div>
<div data-options="region:'west',title:'West',split:true" style="width:150px;">
<!-- 树 -->
<ul id="tree"></ul>
</div>
<div data-options="region:'center',title:'center title'" style="padding:5px;background:#eee;">
<!-- 选项卡 -->
<div id="tabs" class="easyui-tabs" data-options="fit:true">
</div>
</div>
</body>
在页面二的选项卡里链接页面1会出问题 正常情况
加载第二个选项卡不正常，因为table.html链入了两次，所以加载第二个选项卡时存在两个id相同的工具栏，toolbar:'#tb'"会导致加载两个工具栏
所以链入页面不要存在id相同的元素，
当前情况的解决办法 toolbar:'#tb'" 改成toolbar:'' easyui会自动匹配到工具栏，不一定适合其他情况
