LayUI之layer關閉刷新父界面

layer是一款近年來備受青睞的web彈層組件,她具有全方位的解決方案,致力於服務各水平段的開發人員,您的頁面會輕鬆地擁有豐富友好的操做體驗。
最近一個項目採用的是hui前端框架,他的彈出層就是用的layer插件,對於彈出層,有一個操做體驗你們都知道,就是關閉彈出層,須要刷新父頁面。開始寫的時候,我陷入了本身的誤區,在彈出層處理成功以後,我調用的是:前端

var index = parent.layer.getFrameIndex(window.name);
parent.location.href=url;
parent.layer.close(index);

這個地方是這樣寫也沒錯,可是若是這麼寫,它就只能被一個地方調用了,若是有多個地方調用的話,它不能返回原地址,而是重定向到新的url地址上去了。而恰好,在個人項目中間,某一個彈出層被兩個地方調用了,因此很明顯這種方案就不合適了,須要優化。百度了一下,找到以下兩種優化方案:
方案一:
在layer彈出層中調用父界面從新加載函數web

window.parent.location.reload();
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);

方案二:
調用layer插件的end回調方法:
end - 層銷燬後觸發的回調
類型:Function,默認:null
不管是確認仍是取消,只要層被銷燬了,end都會執行,不攜帶任何參數。前端框架

父窗口打開layer彈出框時,添加end回調服務器

function openLayer() {
    //iframe層
        parent.layer.open({
            type: 2,
            title: '修改',
            shadeClose: false, //點擊遮罩關閉
            shade: 0.8,
            area: ['30%', '45%'],
            maxmin: true,
            closeBtn: 1,
            content: [url, 'yes'], //iframe的url,yes是否有滾動條
            end: function () {
                location.reload();
            }
});

layer彈出框處理完成以後,就不須要調用其餘刷新操做函數了,直接關閉就好了框架

var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);

相比較而言,第一種方案會更佳,由於在操做邏輯上,手動關閉彈出框,應該不觸發刷新操做,只有當彈出框的處理邏輯執行成功後,調用函數關閉彈出框才觸發父界面刷新操做,基於這個邏輯,應該選擇方案一。方案二,無論怎樣都會刷新頁面,實際上無故的增長了服務器的處理壓力。函數

相關文章
相關標籤/搜索