EasyUI添加tab页签

不多说,代码如下

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>


以下JSP是用于添加Tab显示

	<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();//自动点击
	});


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值