如何让弹出层处于父页面?

qq_29895339 2015-07-17 11:18:49
网页A是父页面,左侧一个折叠菜单,右侧使用iframe嵌套了子页面B
网页B是一个表单,表单中有个按钮,点击后弹出一个弹出层,弹出层使用iframe调用其他页面。
目前的情况是弹出层、遮罩和居中全部是在子页面B上的,我现在希望弹出层出现在父页面A上,但是返回的值还是子页面B中的表单元素,求教怎么解决?
//弹出窗口
var Dialog = {
//皮肤图片
skin: "/image/dialog1.png",
//弹出窗口
Open : function(url, w, h, title, iscenter, ismask, isdarg){
if($("#rf_dialog").length > 0){return;}
//sys.loadcss(this.css);
var arr = [];
arr.push("<div id=\"rf_dialog\" style=\"font-size:12px;position:absolute;z-index:9999999999\">")
arr.push("<table style=\"width:"+ (w + 26) +"px\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">")
arr.push("<tr style=\"cursor:pointer;\" id=\"rf_dialog_head\">");
arr.push("<td style=\"width:13px;height:33px;background:url("+ this.skin +") 0 0 no-repeat\"></td>");
arr.push("<td style=\"width:"+ w +"px;height:33px;background:url("+ this.skin +") -200px 0 repeat-x\">");
arr.push("<div style=\"width:15px;height:33px;float:left;background:url("+ this.skin +") -26px 0 no-repeat;margin-left:5px\"></div>");
arr.push("<div style=\"float:left;font-weight:bold;color:#fff;margin-top:15px\" onselectstart=\"return false\">" + title + "</div> ");
arr.push("<div style=\"height:17px;width:28px;float:right;background:url("+ this.skin+") 0 -40px no-repeat;margin-top:8px;cursor:pointer\" onmouseover=\"this.style.background='url("+ this.skin +") 0 -60px no-repeat'\" onmouseout=\"this.style.background='url("+ this.skin +") 0 -40px no-repeat'\" drag='false' onclick=\"Dialog.Close();\"></div>")
arr.push("</td>");
arr.push("<td style=\"width:13px;height:33px;background:url("+ this.skin +") -13px 0px no-repeat\"></td>");
arr.push("</tr>");
arr.push("<tr>");
arr.push("<td style=\"width:13px;background:url("+ this.skin +") -40px 0 repeat-y\"></td>");
arr.push("<td style=\"width:"+ w +"px;height:"+ h +"px;background:#fff url("+ this.skin +") -200px -60px repeat-x\">");
arr.push("<iframe src=\""+ url +"\" width=\"100%\" height=\"100%\" frameborder=\"no\" scrolling=\"yes\"></iframe>");
arr.push("</td>");
arr.push("<td style=\"width:13px;background:url("+ this.skin +") -60px 0 repeat-y\"></td>");
arr.push("</tr>");
arr.push("<tr>");
arr.push("<td style=\"width:13px;height:13px;background:url(" + this.skin + ") -70px 0 no-repeat\"></td>");
arr.push("<td style=\"width:" + w + "px;height:13px;background:url(" + this.skin + ") -200px -40px repeat-x;\"></td>");
arr.push("<td style=\"width:13px;height:13px;background:url(" + this.skin + ") -90px 0 repeat-y\"></td>");
arr.push("</td>");
arr.push("</table>");
arr.push("</div>");
$("body").append(arr.join('\n'));
if(iscenter){this.Center(w, h);}
if(ismask){this.Mask();}
if(isdarg){this.Drop("rf_dialog");}
},
//窗口居中
Center : function(w, h){
$("#rf_dialog").css("top", ($(window).height() - h) / 2 + $(window).scrollTop() + "px");
$("#rf_dialog").css("left", ($(window).width() - w) / 2 + $(window).scrollLeft() + "px");
},
//遮罩
Mask : function(){
$("body").append("<div id=\"rf_dialog_mask\" style=\"width:100%;height:100%;position:absolute;top:0;left:0;background:#33393c;filter:alpha(opacity=30);opacity:0.30;-moz-opacity:0.3;z-index:900\"></div>");
//document.body.style.overflow = "hidden";//禁止出现滚动条
var pwbody=document.getElementsByTagName(isQuirks?"body":"html")[0];
pwbody.style.overflow="hidden";
},
//关闭窗口
Close : function(){
$("#rf_dialog").remove();
$("#rf_dialog_mask").remove();//
//document.body.style.overflow = "auto";//还原滚动条
var pwbody=document.getElementsByTagName(isQuirks?"body":"html")[0];
pwbody.style.overflow="auto";
},
Drop : function(obj){
var A=new Function('obj','return document.getElementById(obj);')
var B=new Function('e','if (!e) e = window.event;return e')
var x,y;
A(obj).onmousedown=function(e){
drag_=true;
with(this){
style.position="absolute";var temp1=offsetLeft;var temp2=offsetTop;
x=B(e).clientX;y=B(e).clientY;
document.onmousemove=function(e){
if(!drag_)return false;
with(this){
style.left=temp1+B(e).clientX-x+"px";
style.top =temp2+B(e).clientY-y+"px";
}
}
}
document.onmouseup=new Function("drag_=false");
}
}
};
...全文
415 4 打赏 收藏 转发到动态 举报
写回复
用AI写文章
4 条回复
切换为时间正序
请发表友善的回复…
发表回复
似梦飞花 2015-07-18
  • 打赏
  • 举报
回复
parent.document.body.appendChild(dom)
TRUE_LOVE1314 2015-07-18
  • 打赏
  • 举报
回复
这个可以在html中改
<a href = "xxx.html" target = "A"></a>
A是你想要弹出的那个父框架的id
hch126163 2015-07-17
  • 打赏
  • 举报
回复
$(top.document.body).append(arr.join('\n'));
  • 打赏
  • 举报
回复
在父页面执行你的弹出方法

87,975

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧