长春站建筑,自由做图网站,外贸机械网站建设,室内设计培训内容easyui tabs切换之前提醒保存修改的信息
当存在多个tabs,相互切换时提醒保存修改的信息#xff1a;
这里用的鼠标mousedown事件
var tabs $(#tabsId).tabs().tabs(tabs);for(var item0; itemtabs.length; item){tabs[item].panel(options).tab.unbind().bind(mousedow…easyui tabs切换之前提醒保存修改的信息
当存在多个tabs,相互切换时提醒保存修改的信息
这里用的鼠标mousedown事件
var tabs $(#tabsId).tabs().tabs(tabs);for(var item0; itemtabs.length; item){tabs[item].panel(options).tab.unbind().bind(mousedown,{index:item},function(obj){$.messager.confirm(确认保存修改信息, 是否已经保存修改的信息?, function (row) {if (row) {$(#tabsId).tabs(select, obj.data.index);}});});}例子一个tab标签页面内有定时器需要不在当前页时暂定并保存回到当前页面时继续
关闭标签或页面需要保存的情况 关闭tab相关的情况:
右键关闭所有标签tab标签上的关闭按钮tab刷新按钮tab之前切换
页面或浏览器相关的情况
页面大刷新浏览器上的刷新按钮或按F5页面切换浏览器上的标签切换页面关闭当前网站关闭浏览器关闭浏览器最小化
$(function(){// tabs默认显示主页$(#tabBox).tabs(add,{title: 主页,content: iframe src width100% height100% aligncenter frameborder0 border0/iframe,closable: false});$(#tabBox).tabs(select,0);// tab切换保存taskTime()
})
function taskTime(){// 页面或浏览器相关的情况 都会执行// document.visibilityState hidden,visible// 页面切换$(document).on(visibilitychange, function(e){if($(#tabBox) $(#tabBox).length 0) {let tabs $(#tabBox).tabs(tabs);if (tabs.length 0) {if (document.visibilityState hidden) {// console.log(页面tab切换保存并暂停)$.each(tabs, function (i, n) {let title $(n).panel(options).title;pauseSave(title);})}if (document.visibilityState visible) {$.each(tabs, function (i, n) {let title $(n).panel(options).title;if(TITLESAVE title){ // tab切换时会走判断//继续getContinue(title);}})}}}});$(#tabBox).tabs({onBeforeClose: function(title){// 情况2tab标签上的关闭按钮// 关闭之前保存closeSave(title);return true;},onUpdate: function(title){// 情况3tab刷新按钮// 刷新之前保存closeSave(title);return true;},onSelect(title){// 情况4 tab之前切换// tab切换调用onSelect,获取到当前选中的title,继续计时TITLESAVE titlegetContinue(title)},onUnselect(title){// 不选中时停止计时pauseSave(title);}})// 情况1关闭所有循环保存// 关闭所有$(#closeAll).hide();$(#tabBox).tabs({onContextMenu:function(e,title){e.preventDefault();$(#closeAll).menu(show, {left: e.pageX10,top: e.pageY5});}});$(#closeAll).menu({onClick:function(item){if(item.text关闭所有){// 循环保存closeTabsAll();}else if(item.text刷新当前标签页){}}});}
function closeTabsAll(){var allTabBoxs $(#tabBox).tabs(tabs);// 循环出所有的tab标签$.each(allTabBoxs,function(i,n){let title $(n).panel(options).title;closeSave(title)})var count$(#tabBox).tabs(tabs).length;for(var indexcount;index1;index--){$(#tabBox).tabs(close, index);}
}
// 继续
function getContinue(title){if (document.getElementById(title)) {const iframeWindow document.getElementById(title).contentWindow;if (iframeWindow.timerShow) {let timerShow iframeWindow.timerShow();if (timerShow true) {// 调用子tab中的bts继续计时方法iframeWindow.bts(0);}}}
}
// 暂停保存
function pauseSave(title){if (document.getElementById(title)) {const iframeWindow document.getElementById(title).contentWindow;if (iframeWindow.timerShow) {let timerShow iframeWindow.timerShow();if (timerShow true) {// 调用子tab中的bts暂停计时方法调用tab子页面的保存方法iframeWindow.bts(1);iframeWindow.saveTime();}}}
}
// 关闭保存
function closeSave(title){if(document.getElementById(title)) {const iframeWindow document.getElementById(title).contentWindow;// iframeWindow.timerShow 判断计时组件存在时调用保存方法// timerShow在tab子页面中保存方法saveTime也在tab子页面中if (iframeWindow.timerShow) {let timerShow iframeWindow.timerShow();if (timerShow true) {iframeWindow.saveTime();}}}
}
