页面间隐式通报参数

2024年2月19日 276次阅读 来源: 欧雷

该文写于 2012-08-10

在事情的开辟历程中有个检察报表的需求——从某个页面点击按钮翻开报表页面（该页面为新建窗口）。进入报表页面的进口不是牢固的页面，也不是牢固的按钮，因而差别品种的报表通报的参数差别，而且各组参数之间没什么共同性。底本的完成体式格局是经由过程 URL 的 queryString 将参数通报到报表页面，正如前面所说，差别品种的报表通报的参数差别，因而报表页面就会涌现以下一些题目：

  • URL 太长，看起来很不雅观；
  • 需要对 queryString 举行剖析与推断来鉴别是什么范例的报表；
  • 假如将来多加一些范例的报表的话，推断也会随之增添，如许不仅代码量增添，保护起来也有点难题，还影响机能；
  • 安全性欠佳，经由过程 queryString 找到规律的话，经由过程浏览器地点栏随便地输入一个符合规律的 URL 就可以取得想要看的数据。

鉴于以上几点，我应用父子页面可以相互接见对方 window 对象的特征，想了一个“页面间隐式通报参数”的体式格局。

父页面（进口页面） JavaScript 代码

javascriptwindow.windowPool = [];             // 用于存储子页面的 window 对象及隐式通报的参数

var newWin = window.open( url ),    // 新建窗口，url 为报表页面地点
  reportParams = {};                // 报表所需参数

window.windowPool.push({
  "window": newWin,
  "parameter": reportParams
});

看到上段代码，或许会新鲜地问：“为何要将子页面的 window 对象和报表参数离开，而不是将报表参数绑定在子页面的 window 对象上？”这是由于子页面假如革新了的话，报表参数就会失效了。将子页面（报表页面）的 window 对象与报表参数组合成一个 JSON 添加到数组里是为了防止当从父页面（进口页面）翻开多个显现差别品种报表的报表页面时，新近翻开的报表页面革新操纵而引发的显现后翻开的报表页面内容的题目。

子页面（报表页面） JavaScript 代码

javascriptvar params, index = 0;

for( ; index < opener.windowPool.length; index++ ) {
  if ( opener.windowPool[index].window === window ) {
    params = opener.windowPool[index].parameter;
    break;
  }
}

该体式格局在除了 IE6 以外的浏览器都能一般运转，IE6 没测试过，不清楚兼容性怎样。

    原文作者：欧雷
    原文地址: https://segmentfault.com/a/1190000003009919
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞