1

这是我的父页面,我从中打开一个弹出窗口

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Popup example</title>
    <script type="text/javascript">
        function OpenPop() {
            window.scrollTo(0, 0);
            var width = document.documentElement.clientWidth + document.documentElement.scrollLeft;
            var height = document.documentElement.clientHeight + document.documentElement.scrollTop;
            var layer = document.createElement("div");
            layer.style.zIndex = 2;
            layer.id = "layer";
            layer.style.position = "absolute";
            layer.style.top = "0px";
            layer.style.left = "0px";
            layer.style.height = document.documentElement.scrollHeight + "px";
            layer.style.width = width + "px";
            layer.style.backgroundColor = "black";
            layer.style.opacity = "0.75";
            layer.style.filter += ("progid:DXImageTransform.Microsoft.Alpha(opacity=75)");
            document.body.style.position = "static";
            document.body.appendChild(layer);
            var size = { "height": 220, "width": 400 };
            var iframe = document.createElement("iframe");
            var popUrl = 'popup.htm';
            iframe.name = "Logic Form";
            iframe.id = "popup";
            iframe.src = popUrl;
            iframe.style.height = size.height + "px";
            iframe.style.width = size.width + "px";
            iframe.style.position = "fixed";
            iframe.style.zIndex = 3;
            iframe.style.backgroundColor = "white";
            iframe.frameborder = "0";
            iframe.style.top = ((height + document.documentElement.scrollTop) / 2) - (size.height / 2) + "px";
            iframe.style.left = (width / 2) - (size.width / 2) + "px";
            document.body.appendChild(iframe);
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <a onclick="OpenPop();" href="#">OpenPopup</a>
    </div>
    </form>
</body>

这是我的 popup.html 页面,

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        function closeIframe() {
            var iframe = opener.document.getElementById("popup");
            var layer = opener.document.getElementById("layer");
            iframe.parentNode.removeChild(iframe);
            layer.parentNode.removeChild(layer);
        }
    </script>
</head>
    <body>
        <h3>This is Popup</h3>
        <a onclick="closeIframe();" href="#">Close</a>
    </body>
</html>

问题:在 popup.html 上,有关闭按钮,谁在调用函数来删除 iframe,但我无法关闭弹出窗口,有人帮忙吗?

或者 有人有更好的解决方案或例子来做这样的弹出吗?

任何帮助高度赞赏

4

2 回答 2

1

你的CloseIframe方法应该是:

function closeIframe() {
    window.parent.ClosePop();
}

并在您的主页中,在OpenPop方法下方,添加关闭操作,例如:

function ClosePop() {
    var layer = document.getElementById("layer");
    var iframe = document.getElementById("popup");
    document.body.removeChild(layer); // remove layer
    document.body.removeChild(iframe); // remove div
}
于 2012-09-12T07:15:09.047 回答
0

您可以使用jQuery UI 对话框来显示模态弹出窗口。这将很容易处理。

还有很多 jQuery 插件可用于显示弹出窗口,如花式框颜色框

于 2012-09-12T07:12:32.980 回答