Html之opener对象解决父子tab页信息交换-yellowcong

当我们点击浏览器新建tab页的时候，可以通过浏览器的 opener 来获取到上一个页面打开tab页面的信息，而且可以通过window.onbeforeunload 的事件，来做到通知opener界面的信息

案例

这个需求是，父页面打开了一个子页面（tab页），操作子页面的时候，父页面不许操作，等子页面关闭后，父页面才可以动，这个操作，就是基于opener对象完成的。

//只有通过window.open的方法打开的tab页面才会有opener 对象
#window.open(path, documentId);

//可以通过$("#test", opener.document) 来获取上一个界面里面的元素
$(function(){
    if(opener != null){
            //通过判断字段或者是一个flg 来判断父页面的情况，
            //这个就是为了解决刷新子页面，而父页面的暂停操作解除的问题。
        var isDisp = !!$("#test", opener.document)[0].clientWidth;

        //当父页面的暂停还存在，就接着悬停
        if(!isDisp ) {
            opener.ui.wordWindowCallback(true);
        }
    }
});

//监听浏览器的关闭按钮事件，当关闭浏览器的时候我们可以通过opener操作
window.onbeforeunload = function(e) {
    if(opener != null){
        console.log(e);
        //e 能获取到当前页信息和opener对象信息
        var flg = !!e.explicitOriginalTarget.parentNode;
        //判断父节点的url地址
        var openerUrl =  opener.document.baseURI;
        if(openerUrl.indexOf("xx.do") == -1){
            opener.ui.wordWindowCallback(false);
        }
    }
}