首页 > 代码库 > 项目应用EasyUI_Tab控件全部关闭
项目应用EasyUI_Tab控件全部关闭
一、实际情景:
Tab控件在父页面中<div id="tt" class="easyui-tabs"></div>
多个tab页
<iframe src="http://www.mamicode.com/index0.html">...</iframe>
<iframe src="http://www.mamicode.com/index1.html">...</iframe>
<iframe src="http://www.mamicode.com/index2.html">...</iframe>
<iframe src="http://www.mamicode.com/index3.html">...</iframe>
<iframe src="http://www.mamicode.com/index4.html">...</iframe>
二、要求实现:
在其中一个子页面中点击按钮“全部关闭”,关闭所有的tab页,只保留一个tab页
三、设计思路:
关键点:保证当前页面对应的tab页是最后一个被关闭的。
四、代码逻辑:
// 按钮“全部关闭”执行方法
function closeAllTab() { var len = parent.$(‘#tt‘).tabs(‘tabs‘).length; var currentIndex = parent.$(‘#tt‘).tabs(‘getTabIndex‘, parent.$(‘#tt‘).tabs(‘getSelected‘)); if (len !== currentIndex) { for (var i = 0; i < len - currentIndex - 1; i++) { closeTab(currentIndex + 1, parent.$(‘#tt‘)); } } for (var i = 0; i < len - 1; i++) { closeTab(1, parent.$(‘#tt‘)); } parent.$("#tt").tabs(‘select‘, 0); } // 关闭tab function closeTab(i, $tab) { var tab = $tab.tabs(‘getTab‘, i), title = tab.panel(‘options‘).title; $tab.tabs(‘close‘, title); }
五、图示:
项目应用EasyUI_Tab控件全部关闭
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。