单击 iframe 中的按钮 > 在父窗口中隐藏 div

Question

我在 iframe（与引荐来源网址相同的域）中的按钮上获取点击事件并使其关闭（在本例中）父窗口中的 2 个 div 时遇到问题。

主页的示例 html：

<div class="wrapper">
    <iframe src="foo"></iframe>
</div>
<div class="bg"></div>

iframe 的示例 html：

<div class="btn_wrapper">
    <a href="http://www.foobar.com" class="yes">Yes</a>
    <a class="no">No</a>
</div>

JS：

// redirect
$('body').on('click', '.btn_wrapper .yes', function() {
    window.top.location = 'http://www.foobar.com';
});

// hide iframe popup wrapper and bg
$('body').on('click', '.btn_wrapper .no', function() {
    $('.wrapper').fadeOut(250, function() {
        $('.bg').fadeOut(150);
    });
});

$('body').on('click'... 函数确实运行成功，因为单击“是”按钮会重定向，在我的完整代码中，单击“否”以设置 cookie，它确实如此。

由于某种原因，它只是不隐藏包含 iframe 和背景覆盖的 .wrapper。我怎样才能做到这一点？

对于我正在构建的东西，我不必严格使用 iframe，但是为了与已有功能的一致性和集成，我真的很想继续使用 iframe。

Answer 1

试试：

$('body').on('click', '.btn_wrapper .no', function() {
    $('.wrapper', window.parent.document).fadeOut(250, function() {
        $('.bg', window.parent.document).fadeOut(150);
    });
});