不多说,代码如下
JSP
页面中显示的目录
<div title="信息管理" style="overflow:auto;">
<div class="easyui-panel" data-options='fit:true,border:false' style="background-color: #91D7FF">
<ul class="menu">
<li>
<a id="CZSH" href="javascript:void(0)" url="<%=path%>/jsp/XXGL/CZSHB.jsp">
<img alt="" src="<%=path%>/Script/themes/img/CZSH2.png"
style="width: 55px;height: 55px"/>
<div>
<span class="fontList"><b>XXXX</b></span>
</div>
</a>
</li>
</ul>
</div>
</div>
<div id="content" data-options="region:'center'" style="border: 2px solid #95B8E7;">
<div id="main-tab" class="easyui-tabs" style="height:100%;" data-options="fit : true,border:false">
</div>
</div>
JS添加Tab
/**
* 添加tab页签
*
* @param e
*/
addTab : function(e, beforeAdd) {
if (beforeAdd != null) {// 添加tab页签前触发事件
var r = beforeAdd();
if (r != true)
return;
}
var title = $(e).attr("title") == undefined ? $(e).text() : $(e).attr(
"title");
if ($('#main-tab').tabs('exists', title)) {
$('#main-tab').tabs('select', title);
this.endMask();
} else {
$('#main-tab').tabs(
'add',
{
title : title,
content : '<div id="tab-' + e.id + '" url='
+ $(e).attr("url") + ' ></div>',
closable : true
});
this.startMask();
$("#tab-" + e.id + "").load($(e).attr("url"), function() {
fzp.endMask();
$.parser.parse(this);
});// 加载页面
}
},
/**
* 获取选中的tab页签
*/
getSelectedTab : function() {
var tt = $('#main-tab').tabs("getSelected");
return tt;
}
以下是触发方法,当点击a标签中的内容时,将触电发上面的方法,进行添加Tab
$(document).ready(function() {
$(".menu li a").click(function() {
fzp.addTab(this);
});
fzp.TabMenu();
fzp.ShowMessager();
setInterval(function() {
fzp.ShowMessager();
}, 20000);
$("#CZSH").click();//自动点击
});