easyui的tab标签

当点击左边菜单栏是在右侧动态生成标签页，这里实现了两种效果，一个是在嵌套一个新的页面，一个是直接生成标签页并添加一个datagrid。总的来说，嵌套页面感觉更实用些，因为可以在新的页面加一些元素，如form表单之类的用作查询。而直接生成标签页，则不方便做这些。

<div>
<ul>
<li id="userManage" οnclick="addTab('用户管理','u1.jsp')">test</li>
<li οnclick="addTabTest('Test','mingge/users','tb1')">aaaa</li>
</ul>
</div>
<script type="text/javascript">
	function addTab(title, url){
		if ($('#tt').tabs('exists', title)){
			$('#tt').tabs('select', title);
		} else {
			var content = '<iframe scrolling="auto" frameborder="0"  src="'+url+'" style="width:100%;height:100%;"></iframe>';
			$('#tt').tabs('add',{
				title:title,
				content:content,
			//	href:url,
				closable:true
			});
		}
	}

	function addTabTest(title,url,tableId){
		if ($('#tt').tabs('exists', title)){
			$('#tt').tabs('select', title);
		}
		else{
			$("#tt").tabs('add', {
        title: title,
        closable: true,
        tools: [{
            iconCls: 'icon-mini-refresh',
            handler: function() {
                alert('refresh');
            }
        }]
    });
     
    var currentTabPanel = $("#tt").tabs('getSelected');
    var dynamicTable = $('<table id=tableId></table>');
    //这里一定要先添加到currentTabPanel中，因为dynamicTable.datagrid()函数需要调用到parent函数
    currentTabPanel.html(dynamicTable);
    dynamicTable.datagrid({
        url:url,
        columns:[[
       {field:'userid',title:'用户Id',width:100,align:'center'},
					{field:'username',title:'用户名',width:100,align:'center',sortable:true},
					{field:'price',title:'Price',width:100,align:'center'},
					{field:'price',title:'删除',width:100,align:'center'}
        ]],
         pagination:true,
		pageSize:10,
		pageList:[10,20,30,40],
		fit:true,
		fitColumns:true,
        });
		}
		
	}

</script>