需求描述：審批表單頁面由我的待辦工作中打開，辦理完畢后希望關(guān)閉該頁面并且實現(xiàn)我待辦表格的實時刷新;同時該需求也同樣適用于從某些工作流管理模塊中需要發(fā)起審批的情況，比如招聘需求模塊中發(fā)起錄用流程;我的績效管理中審批績效等。

我們先來看看之前的實現(xiàn)，該邏輯實現(xiàn)的功能是，從我待辦列表中發(fā)起審批，審批結(jié)束后直接在當(dāng)前頁面，也就是審批頁面跳轉(zhuǎn)至一個新的oa主頁面，并且打開我的工作-我待辦的頁簽，實現(xiàn)方法如下：

$("#but_back").bind("click", function() { 
        window.top.opener=null; 
        var url = window.location.href; 
        var isoa=url.indexOf('phicomm.com'); 
        //var isoatest=url.indexOf('oatest.phicomm.com'); 
        var curWwwPath=window.document.location.href;  
        var pathName=window.document.location.pathname;  
        var pos=curWwwPath.indexOf(pathName);  
        var localhostPaht=curWwwPath.substring(0,pos);  
        var projectName=pathName.substring(0,pathName.substr(1).indexOf('/')+1); 
        if(isoa>0){ 
            window.top.open(localhostPaht+'/main/index.action?tableName=mywork','_self'); 
        }else{ 
            window.top.open(localhostPaht+projectName+'/main/index.action?tableName=mywork','_self'); 
        } 
    }); 

桌面js的處理邏輯：

$(document).ready(function($){ 
    // 初始化圖標(biāo) 
    initModules(initMenus()); 
      
    refixAppPos(); 
    // 注冊事件 
    regClick(); 
      
    sortable(); 
   initIcoRemove(); 
      
    initAppManager(); 
    //解析當(dāng)前URL判斷是否需要跳轉(zhuǎn)制定Table 
    gotoTable(); 
}); 
  
//跳轉(zhuǎn)制定Table 
function gotoTable(){ 
    var tableName = request("tableName"); 
    if(""!=tableName&&null!=tableName&&'undefined'!=tableName){ 
        openUrl($("#desktop_content_icon_"+tableName)); 
    } 
} 

 以上方法雖然實現(xiàn)了辦理結(jié)束后跳至我的待辦的功能，但有以下缺陷：

跳轉(zhuǎn)是在新頁面中，并非在調(diào)用頁面，這樣就形成了調(diào)用和跳轉(zhuǎn)頁面兩個相同的桌面;

新的頁面并非與原調(diào)用頁面完全一致，調(diào)用頁面如打開多個頁簽，新打開的頁面相當(dāng)于將除我的待辦外的其他頁簽關(guān)閉，并不符合用戶的需求;

用戶體驗不友好

我們使用js callback的實現(xiàn)如下，當(dāng)前頁面的調(diào)用頁面非空且未關(guān)閉時，我們就直接調(diào)用頁面中的js方法實現(xiàn)其局部的刷新。

/** 刷新父窗口關(guān)閉彈出窗口 */ 
    function refreshAndClose(){ 
        var jscallback = $.trim($("#jscallback").val()); 
        var type = $.trim($("#type").val()); 
        if (window.opener  && !window.opener.closed && jscallback!=null && jscallback!="") { 
            if(!type){ 
                //本頁面的調(diào)用頁面執(zhí)行其嵌入或調(diào)用的js方法 
                eval("window.opener."+jscallback+"();"); 
            } 
            window.close();//當(dāng)前頁面關(guān)閉 
        } else { 
            window.top.opener=null; 
            var url = window.location.href; 
            var isoa=url.indexOf('phicomm.com'); 
              
            var curWwwPath=window.document.location.href;  
            var pathName=window.document.location.pathname;  
            var pos=curWwwPath.indexOf(pathName);  
            var localhostPaht=curWwwPath.substring(0,pos);  
            var projectName=pathName.substring(0,pathName.substr(1).indexOf('/')+1); 
            if(isoa>0){ 
                  
                window.top.open(localhostPaht+'/main/index.action?tableName=mywork','_self'); 
            }else{ 
                window.top.open(localhostPaht+projectName+'/main/index.action?tableName=mywork','_self'); 
            } 
        } 
    } 

調(diào)用頁面js：grid即為需要局部刷新的表格。 

function openUrl(url){ 
    url=url+"&jscallback=callsus" 
         window.open(url,'_blank');    
} 
function callsus(){ 
    $('#performanceDataGrid').reload(); 
} 

通過js callback實現(xiàn)了調(diào)用頁面的局部刷新，并對其他應(yīng)用的類似功能具有一定的指導(dǎo)和參考意義。

本文出自 “南湖礦工技術(shù)空間” 博客，請務(wù)必保留此出處http://jncumter.blog.51cto.com/812546/1623739