多标签页完成
This commit is contained in:
parent
96d60bf2d4
commit
c9c7ce6067
|
@ -321,13 +321,28 @@ function isIntNum(val) {
|
|||
// }
|
||||
// }
|
||||
function changehref(o) {
|
||||
|
||||
_clickTab = $(o).attr('url');// 找到链接a中的targer的值
|
||||
_title = $(o).attr('title');
|
||||
|
||||
_value = $(o).attr('value');
|
||||
|
||||
$("#main").attr('value', _value);
|
||||
$("#main").panel({ href: _clickTab, title: $(o).attr('title') });
|
||||
|
||||
if ($('#tt').tabs('tabs').length > 10) {
|
||||
alert('标签页过多,请先关闭')
|
||||
return
|
||||
}
|
||||
if ($('#tt').tabs('exists', _title)) {
|
||||
$('#tt').tabs('select', _title);
|
||||
//var tab2 = $('#tt').tabs('getSelected');
|
||||
//tab2.panel('refresh');
|
||||
} else {
|
||||
$('#tt').tabs('add', {
|
||||
title: _title,
|
||||
href: _clickTab,
|
||||
closable: true,
|
||||
});
|
||||
}
|
||||
// $.ajax({
|
||||
// type: "get",
|
||||
// url: _clickTab,
|
||||
|
|
|
@ -114,7 +114,7 @@
|
|||
headimgurl="{{headimgurl}}" menus="{{menus}}" style="display:none;" />
|
||||
|
||||
<button style="margin: 15px;background-color: transparent;border: 0;color: white;cursor: pointer;"
|
||||
onclick="javascript:$('#main').panel({href:'mainhtml',title:'主页'})"><span
|
||||
onclick="javascript:$('#tt').tabs('select',0)"><span
|
||||
style="font-size:24px">{{companyname}}</span><br /><span
|
||||
style="font-size:20px">安全生产管理系统</span></button>
|
||||
</div>
|
||||
|
@ -178,16 +178,11 @@
|
|||
<input type="hidden" id="in" show="" total="" target="" show2="" />
|
||||
<!-- <button type="hidden" id="getb" onclick="test()" /> -->
|
||||
|
||||
<div id="rcmenu" class="easyui-menu">
|
||||
<div id="closecur">
|
||||
关闭
|
||||
</div>
|
||||
<div id="closeall">
|
||||
关闭全部
|
||||
</div>
|
||||
<div id="closeother">
|
||||
关闭其他
|
||||
</div>
|
||||
<!-- tab页的右键菜单 -->
|
||||
<div id="home-tabs-menu" class="easyui-menu">
|
||||
<div data-options="name:1">关闭</div>
|
||||
<div data-options="name:2">关闭其他</div>
|
||||
<div data-options="name:3">关闭所有</div>
|
||||
</div>
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
|
@ -198,7 +193,8 @@
|
|||
var allTabs = $('#tt').tabs('tabs');
|
||||
var selectTab = $('#tt').tabs('getSelected');
|
||||
for (var i = 0; i < allTabs.length; i++) {
|
||||
if (allTabs[i].panel('options').title != selectTab.panel('options').title) {
|
||||
if(allTabs[i]){
|
||||
if (allTabs[i].panel('options').title != selectTab.panel('options').title) {
|
||||
$('#tt').tabs('update', {
|
||||
tab: allTabs[i],
|
||||
options: {
|
||||
|
@ -206,46 +202,31 @@
|
|||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
selectTab.panel('refresh')
|
||||
//selectTab.panel('refresh')
|
||||
// console.log(allTabs[0].panel('options').content)
|
||||
},
|
||||
onContextMenu: function(e, title, index){
|
||||
//该方法通知浏览器不要执行与此事件关联的默认动作
|
||||
//即屏蔽了浏览器在tab页上的鼠标右键事件
|
||||
e.preventDefault();
|
||||
var mm = $("#home-tabs-menu");
|
||||
//显示右键菜单
|
||||
mm.menu("show",{
|
||||
top: e.pageY,
|
||||
left: e.pageX
|
||||
}).data("tabTitle",title);
|
||||
//为右键菜单选项绑定事件
|
||||
mm.menu({
|
||||
onClick: function(item){
|
||||
closeTab(this, item.name);
|
||||
}
|
||||
});
|
||||
$(".tabs-header").bind('contextmenu',function(e){
|
||||
e.preventDefault();
|
||||
$('#rcmenu').menu('show', {
|
||||
left: e.pageX,
|
||||
top: e.pageY
|
||||
});
|
||||
});
|
||||
//关闭当前标签页
|
||||
$("#closecur").bind("click",function(){
|
||||
var tab = $('#tt').tabs('getSelected');
|
||||
var index = $('#tt').tabs('getTabIndex',tab);
|
||||
if(index!=0){
|
||||
$('#tab').tabs('close',index);
|
||||
}
|
||||
|
||||
});
|
||||
//关闭所有标签页
|
||||
$("#closeall").bind("click",function(){
|
||||
var tablist = $('#tt').tabs('tabs');
|
||||
for(var i=tablist.length-1;i>0;i--){
|
||||
$('#tt').tabs('close',i);
|
||||
}
|
||||
});
|
||||
//关闭非当前标签页(先关闭右侧,再关闭左侧)
|
||||
$("#closeother").bind("click",function(){
|
||||
var tablist = $('#tt').tabs('tabs');
|
||||
var tab = $('#tt').tabs('getSelected');
|
||||
var index = $('#tt').tabs('getTabIndex',tab);
|
||||
for(var i=tablist.length-1;i>index;i--){
|
||||
$('#tt').tabs('close',i);
|
||||
}
|
||||
var num = index-1;
|
||||
for(var i=num;i>0;i--){
|
||||
$('#tt').tabs('close',i);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
$.messager.show({
|
||||
|
@ -359,9 +340,9 @@
|
|||
}
|
||||
if ($('#tt').tabs('exists', title)) {
|
||||
$('#tt').tabs('select', title);
|
||||
var tab2 = $('#tt').tabs('getSelected');
|
||||
var url = $(tab2.panel('options')).attr('href');
|
||||
tab2.panel('refresh', url);
|
||||
//var tab2 = $('#tt').tabs('getSelected');
|
||||
// var url = $(tab2.panel('options')).attr('href');
|
||||
//tab2.panel('refresh');
|
||||
} else {
|
||||
$('#tt').tabs('add', {
|
||||
title: title,
|
||||
|
@ -382,6 +363,42 @@
|
|||
$.get('api/rights?a=have', function (res) {
|
||||
localStorage.setItem('data', JSON.stringify(res));
|
||||
})
|
||||
|
||||
function closeTab(menu, type){
|
||||
var allTabs = $("#tt").tabs("tabs");
|
||||
var allTabTitle = [];
|
||||
$.each(allTabs, function(i, n){
|
||||
var opt = $(n).panel("options");
|
||||
if(opt.closable){
|
||||
allTabTitle.push(opt.title);
|
||||
}
|
||||
});
|
||||
var curTabTitle = $(menu).data("tabTitle");
|
||||
switch(type){
|
||||
case 1:
|
||||
//关闭当前
|
||||
$("#tt").tabs("close", curTabTitle);
|
||||
return false;
|
||||
break;
|
||||
case 2:
|
||||
//关闭其他
|
||||
for(var i = 0; i < allTabTitle.length; i++){
|
||||
if(curTabTitle != allTabTitle[i] && curTabTitle != '主页'){
|
||||
$("#tt").tabs("close",allTabTitle[i]);
|
||||
}
|
||||
}
|
||||
$("#tt").tabs("select",curTabTitle);
|
||||
break;
|
||||
case 3:
|
||||
//关闭所有
|
||||
for(var i = 0; i < allTabTitle.length; i++){
|
||||
if(curTabTitle != '主页'){
|
||||
$("#tt").tabs("close",allTabTitle[i]);
|
||||
}
|
||||
}
|
||||
break;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
|
|
@ -97,7 +97,7 @@ float: left;">
|
|||
font-weight: 300;
|
||||
font-size: 11px;
|
||||
color: #fff;
|
||||
opacity: 0.7;height: 20px;cursor: pointer;" title="在线培训" onclick="changehref(this)">
|
||||
opacity: 0.7;height: 20px;cursor: pointer;" title="线下培训" onclick="changehref(this)">
|
||||
点击查看全部
|
||||
<i style="background-position: -27px -10px;width: 14px;
|
||||
height: 14px; vertical-align: top;background-repeat: no-repeat;margin-top: 4px;
|
||||
|
|
Loading…
Reference in New Issue