5

请参阅下面的更新 (11/27)

我有一个模式窗口，它在 iframe（ASP webforms 应用程序）中启动它的内容。我们需要将模式重定向到另一个页面，但由于安全原因（Paypal 处理页面），它不能在 iframe 内。在 Chrome 和 IE 标准模式下，我们的代码可以将模式的 URL 正确更改为正确的 URL。但是在兼容模式下，重定向会导致一个新的模式窗口以正确的 URL 打开。我们如何阻止它打开一个新窗口并实际重定向？

这是我们当前的代码：

dialog.redirect = function (location, ignoreFrames) {
        /// <summary>Redirects the dialog to a new URL</summary>
        /// <param name="location" type="String"></param>
        /// <param name="ignoreFrames" type="Boolean">If true, the dialog's URL will be changed instead of any parent frame URLs</param>

        if (ignoreFrames === undefined) {
            ignoreFrames = true;
        }

        if (ignoreFrames === true) {
            if (window.top) {
                //Chrome and IE9+
                window.top.document.location.replace(location);
            } else {
                //This was a supposed fix but it did not change the outcome
                //<IE8 and compat mode
                var redirectLink = document.createElement("a");
                redirectLink.href = location;
                document.body.appendChild(redirectLink);
                redirectLink.click();
            }
        } else {
            window.document.location.replace(location);
        }
    };

更新 11/27，带有问题示例：

交互式示例（需要 IE10+ 或任何好的浏览器）

以下是该问题的一个示例，所有内容都设置了我们如何拥有它。当模态框处于 IE 兼容模式时，它会打开一个新窗口，而不是重定向模态框。将页面修复为兼容模式并非易事，因为我们的应用程序依赖于兼容模式，并且外部模式页面在任何地方都被广泛使用。在 FireFox 中查看页面（main.html）（Chrome 存在域安全问题），它按预期工作；模态完全重定向到新页面。

main.html

<html>
<head></head>
<body>
    <a href="javascript:window.showModalDialog('modal.html', self, 'status:no;resizable:yes;help:no;scroll:no;width:1000;height:600')">Open Modal</a>
</body>
</html>

模态的.html 

<!--[if lt IE 7]> <html class="lt-ie9 lt-ie8 lt-ie7"> <![endif]--> 
<!--[if IE 7]>    <html class="lt-ie9 lt-ie8"> <![endif]--> 
<!--[if IE 8]>    <html class="lt-ie9"> <![endif]--> 
<!--[if gt IE 8]><!--> <html class=""> <!--<![endif]-->
    <head>
        <title id="tagTitle"></title>
    </head>
    <body style="margin:0px">     
        <form name="Form1" method="post" action="" id="Form1">
            <strong>modal.html</strong><br />
            <iframe frameborder="1" src="frame.html" scrolling="yes"></iframe>
        </form>
    </body>
</html>

框架.html

<!DOCTYPE html>
<!--[if lt IE 7 ]> <html class="ie6" xmlns="http://www.w3.org/1999/xhtml"> <![endif]-->
<!--[if IE 7 ]>    <html class="ie7" xmlns="http://www.w3.org/1999/xhtml"> <![endif]-->
<!--[if IE 8 ]>    <html class="ie8" xmlns="http://www.w3.org/1999/xhtml"> <![endif]-->
<!--[if IE 9 ]>    <html class="ie9" xmlns="http://www.w3.org/1999/xhtml"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html class="" xmlns="http://www.w3.org/1999/xhtml">
<!--<![endif]-->
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
</head>
<body>
<strong>frame.html</strong><br />
<a href="javascript:void(0)" onclick="redirectToCart();" title="My Cart">Trigger Redirect</a>

<script type="text/javascript">
    var redirect = function (location, ignoreFrames) {
        /// <summary>Redirects the dialog to a new URL</summary>
        /// <param name="location" type="String"></param>
        /// <param name="ignoreFrames" type="Boolean">If true, the dialog's URL will be changed instead of any parent frame URLs</param>

        if (ignoreFrames === undefined) {
            ignoreFrames = true;
        }

        if (ignoreFrames === true) {
            window.top.document.location.replace(location); //IE will create a new window at this point, instead of changing the modal's URL
        } else {
            window.document.location.replace(location);
        }
    };

    function redirectToCart() {
        redirect('anotherpage.html', true); //Change this to false to see just the inner frame's URL change
    }
</script>
</body>
</html>

另一个页面.html 

<html>
<head>

</head>
<body>
    <strong>anotherpage.html</strong><br />
    Success
</body>
</html>
4

1 回答 1

7

出现您的问题是因为您正在使用showModalDialogwhich 在使用IE.

你可以在这里读到它：

showModalDialog 打开一个新窗口

如果您想继续使用showModalDialog这里是一种解决方法：

modal.html

<head>
    <base target="_self" />
    ...
</head>
<body style="margin:0px">     
        ....
        <a href="anotherpage.html" id="go" style="display:none;"></a>
    </form>
</body>

frame.html

function redirectToCart() {
    window.parent.document.getElementById('go').click(); 
}

例子

http://plnkr.co/edit/ClxlWqkzBmTy93kJzuru?p=preview

于 2013-11-27T21:12:46.417 回答