window.opener在重定向后的javascript弹出窗口中未定义

时间:2013-07-04 12:04:21

标签: javascript html

我在使用window.open()显示付款对话框的网站时遇到问题。

弹出窗口中的页面会重定向到重定向回结果页面的其他域。在结果页面上,我尝试在window.opener上设置一个属性,表示付款正常。

这适用于某些用户。但是,其他用户会收到错误消息,指出window.opener未定义。

可以使用这些简单的页面重新创建问题:

的index.html (打开弹出窗口)

<!DOCTYPE html>
<html lang="en">
<body>
    <input type="button" value="Popup" onclick="openPaymentWindow();" />

    <div id="result" style="background-color: silver;"/>

    <script type="text/javascript">
        function openPaymentWindow() {
            win = window.open('popup.html', 'popup');            
        }
    </script>    
</body>
</html>

popup.html (重定向到其他域)

<!DOCTYPE html>
<html>
<body onload="document.forms[0].submit();">
    <form action="http://[other_domain]/payment.html">
    </form>
</body>
</html>

payment.html (重定向回原始域名)

<!DOCTYPE html>
<html>
<body onload="document.forms[0].submit();">
    <form action="http://[original_domain]/result.html">
    </form>    
</body>
</html>

result.html (在索引页面上设置属性)

<!DOCTYPE html>
<html>
<body>
    <input type="button" value="Call top" onclick="callTop();" />

    <script type="text/javascript">
        function callTop() {
            // Here, window.opener (and top.opener) is undefined for some users
            window.opener.document.getElementById('result').style.background = 'green';
        }
    </script>  
</body>
</html>

由于并非所有用户都受到影响,我的猜测是它与某些安全设置有关。但我根本无法弄清楚在哪里找到它们 - 或者如何在我自己的电脑上复制错误。

1 个答案:

答案 0 :(得分:0)

有一种方法可以达到你想要的效果,但它可能不是很干净。 因此index.htmlresult.html位于同一个域中,index.html中的脚本包含对弹出窗口对象的引用。这意味着,如果您在window中的result.html对象上设置了某个属性,则可以在win中的index.html变量上读取该属性。唯一的问题是你不知道什么时候设置了属性,所以你必须使用setInterval来检查它。

<强>的index.html

function openPaymentWindow() {
    var win = window.open('popup.html', 'popup');

    var successPoller = setInterval(function() {
        try {
            if(typeof win.PAYMENT_SUCESS !== 'undefined' && win.PAYMENT_SUCESS) {
                document.getElementById('result').style.background = 'green';
                clearInterval(successPoller);
            }
        }
        catch (error) {
            // handle error
        }
    }, 500);
}

<强> result.html

 function callTop() {
      window.PAYMENT_SUCCESS = true;  
 }