夏日博客

A-A+

artdialog弹出层iframe间数据传递分析

2016年01月09日 前端设计 暂无评论 阅读 8 views 次

在弹出的iframe再传值这个功能其实做起来是比较简单了，但是如果是基于artdialog弹出层iframe并且有多个层可能就会有一些bug了，下面来看问题解决方法．

我做的框架是基于artDialog的，其提供的 iframeTool plugin 实现了多级弹出层均基于同一parent的方式，使视觉上的多层弹出突破了可视范围的限制。

但是，多个弹出层基于同一父页面，便导致一个难题，如何界定弹出层的级别。

在开发框架的时候，我认为自己已经解决了这个问题，就是通过 parent.iframes 数组的序号来判断，而后来发现datapicker插件会创建iframe，ie某些版本对parent.iframes的序号处理与众相反，因此导致了一些BUG。

由于在我框架中所以弹出层都是以lock形式弹出，即用遮罩锁定父页面，所以我认为上一个页面就是父页面。
如今，发表一下目前较完善处理办法：

  1. //realparent是最终结果，以全局变量方式存在  
  2. realparent=parent; //初始值  
  3.    
  4. //临时变量iframeIndexArr记录由artDialog实现的弹出层的真实序号  
  5. var iframeIndexArr=new Array();  
  6.    
  7. //遍历parent.frames，通过name找出通过artDialog实现的弹出层，并把真实序号记录进iframeIndexArr中  
  8. for(var i=0;i<parent.frames.length;i++){  
  9.     if(parent.frames[i].name.indexOf('OpenartDialog')>-1){  
  10.         //若是artDialog，则记录其index  
  11.         iframeIndexArr[iframeIndexArr.length]=i;  
  12.     }  
  13. }  
  14.    
  15. //若由artDialog实现的弹出层数量是2或以上，则认为上一个弹出层是其真实父页面  
  16. if(iframeIndexArr.length>1){  
  17.     //若最小artDialog是当前弹出层，属于IE某些版本的倒序iframe模式，则下一序号就是真实父页面的序号  
  18.     if(parent.frames[iframeIndexArr[0]].location.href==location.href){  
  19.         realparent=parent.frames[iframeIndexArr[1]];  
  20.     }  
  21.     //正常情况，iframe正序排列，则倒数第二个序号就是真实父页面的序号  
  22.     else{  
  23.         realparent=parent.frames[iframeIndexArr[iframeIndexArr.length-2]];  
  24.     }  
  25. }  

取得了realparent，数据传递就迎刃而解了。

标签：

给我留言