easyUI彈框被遮罩層遮擋
阿新 • • 發佈:2018-11-12
async on() href 復制代碼 iss 無法 get 代碼 url
項目中用到easyui 布局,用到north,west,center三個區域,且在center中間區域嵌入iframe標簽。在主內容區做一些小提示彈窗(例如刪除前的彈窗提示確認)時,會遇到遮罩問題,由於center區域是iframe嵌套的,所以裏面的小彈窗無法覆蓋頁面的頭部和左邊目錄欄。
情形一、點擊提示彈窗裏的確認後,提示彈窗消失:
//warnTips為傳入的值,例如successMask(“確定要刪除選中的數據嗎?”)
function successMask(warnTips){ parent.$.messager.alert({ title:‘‘, msg:warnTips, draggable:false, fn:function(){
} }); }
情形二、點擊提示彈窗裏的確認後,提示彈窗消失,並且頁面跳轉:
//使用方法,successMask(‘刪除成功!‘,‘system/js/rolepermissions.jsp‘)
function successMask(warnTips,url){ parent.$.messager.alert({ title:‘‘, msg:warnTips, draggable:false, fn:function(){ //點擊確認後,頁面跳轉 window.location.href = url; } }); }
使用以上代碼可以完美解決easyUI center區域iframe裏的alert提示彈窗、confirm彈窗的遮罩問題。
這裏再做一個拓展,如果是confirm確認彈窗,改如何處理遮罩問題?
例如刪除前提示確認,點擊確認後,內容被刪除,再彈出刪除成功提示框:
用如下代碼,就可以解決問題
parent.$.messager.confirm({ title:‘‘, msg:‘確定要刪除選中的數據嗎?‘, draggable:false, fn:function(boolean){ if(boolean){//確定刪除操作 var id = $(obj).attr ("id"); $.ajaxSettings.async = false; $.get("roleAction!deleteRole.html",{q:new Date().getTime(),id:id},function(data){ if(data==‘success‘){ successMask(‘刪除成功!‘,‘system/js/rolepermissions.jsp‘) }else{ infoMask(data);
}
}
}
}
easyUI彈框被遮罩層遮擋