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

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

  但是,多个弹出层基于同一父页面,便导致一个难题,如何界定弹出层的级别。
在开发框架的时候,我认为自己已经解决了这个问题,就是通过 parent.iframes 数组的序号来判断,而后来发现datapicker插件会创建iframe,ie某些版本对parent.iframes的序号处理与众相反,因此导致了一些BUG。
由于在我框架中所以弹出层都是以lock形式弹出,即用遮罩锁定父页面,所以我认为上一个页面就是父页面。

如今,发表一下目前较完善处理办法:

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

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

时间: 2024-10-31 12:43:21

artdialog弹出层iframe间数据传递分析的相关文章

Asp.net利用JQuery弹出层加载数据代码_实用技巧

首先我们新建一个网站,在网站里面新增一般处理程序,命名为ReadData.ashx.然后在里面输入如下代码: 复制代码 代码如下: using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Services; using System.Data.SqlClient; //引入命名空间 using System.Data; namespace 加载层 {

js artDialog弹出层插件使用例子

 代码如下 复制代码 <!DOCTYPE html> <html> <head> <script type="text/javascript" src="http://x6.com/js/jquery.min.js"></script> <script type="text/javascript" src="http://x6.com/js/jquery.artDialo

解决artDialog弹出的iframe窗口不能关闭

artDialog用法  代码如下 复制代码 art.dialog(options) var dialog = art.dialog({     title: '欢迎',     content: '欢迎使用artDialog对话框组件!',     icon: 'succeed',     follow: document.getElementById('btn2'),     ok: function(){         this.title('警告').content('请注意artDi

artDialog弹出的iframe窗口不能写程序解决办法

弹窗方法(关闭弹窗时刷新当前窗体):  代码如下 复制代码 art.dialog.open('EditPublicInfo.aspx', { title: '添加重要通知与特别提醒', width: 800, height: 600, lock: true,     closeFn: function () {       location.reload();     }   }); 使用服务器控件按钮时artDialog的关闭方法: 页面中放置一个默认隐藏的Panel,代码放在Panel中,事

JavaScript学习总结(二)——延迟对象、跨域、模板引擎、弹出层、AJAX示例

一.AJAX示例 AJAX全称为"Asynchronous JavaScript And XML"(异步JavaScript和XML) 是指一种创建交互式网页应用的开发技术.改善用户体验,实现无刷新效果. 1.1.优点 不需要插件支持 优秀的用户体验 提高Web程序的性能 减轻服务器和带宽的负担 1.2.缺点 浏览器对XMLHttpRequest对象的支持度不足,几乎所有浏览器现在都支持 破坏浏览器"前进"."后退"按钮的正常功能,可以通过简单的

JS+CSS实现可拖拽的漂亮圆角特效弹出层完整实例

 这篇文章主要介绍了JS+CSS实现可拖拽的漂亮圆角特效弹出层,以完整实例形式分析了弹出层特效及圆角矩形的实现技巧,需要的朋友可以参考下     本文实例讲述了JS+CSS实现可拖拽的漂亮圆角特效弹出层的方法.分享给大家供大家参考.具体如下:   代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-tran

easyui弹出层在最顶层显示跳出iframe框架通用javascript代码

原文:easyui弹出层在最顶层显示跳出iframe框架通用javascript代码 有时候我们用easyui在后台框架中弹框的时候,总是显示在框架页面里面而不是整个系统框架的上面,看着有些不太乐意. dialog = function (opts) { var query = parent.$, fnClose = opts.onClose; opts = query.extend({ title: 'My Dialog', width: 400, height: 220, closed: f

jquery处理页面弹出层查询数据等待操作实例_jquery

本文实例讲述了jquery处理页面弹出层查询数据等待操作.分享给大家供大家参考.具体实现方法如下: $(document).ready(function(){ layer.load(0); //初始化加载 //可选范围(0-9)0表示等返回结果后关闭,1-9表示自动关闭时间(s) }); 当查询结果集返回后,设置关闭等待的样式 function init_page_pro(sdate, pro) { $.post("detail.key", { 'pro' : pro, 'sdate'

ajax layer-关于layer弹出层内容 显示ajax取得的数据

问题描述 关于layer弹出层内容 显示ajax取得的数据 代码 $.ajax({ type:'POST', url: 'hhWebsiteInfoController.do?website-getDt', dataType:'json', data:'', success:function(json){ alert(1); var dts = json.attributes.dts; $("#news").empty(); var quanju = dts; if(typeof(dt