Question

我有一个Wordpress网站，帖子被加载到iframe中。

这是有效的代码：

<a class="trick" rel="<?php the_permalink() ?>" href="<?php the_permalink() ?>"><?php the_title(); ?></a>

$（document）.ready（function（）{

    $.ajaxSetup({cache:false});
    $(".trick").click(function(){
        var post_link = $(this).attr("rel");
        $("#frame").css("display","block");
        $("#frame").attr("url", post_link);
        $("body").css("overflow","hidden");
    });

  });         </script>

<iframe id="frame" frameborder="no" allowtransparency="true" width="100%" height="100%" scrolling="no" src=""></iframe>

现在，如何从iframe内部关闭此加载的iframe？

主页面是index.php（主要的wordpress循环），iframe的内容是single.php（单个帖子），没有页眉和页脚。

感谢。

这就是我在single.php中所拥有的

<head>

<script src="http://code.jquery.com/jquery-latest.js"></script>
    <script>
    $(document).ready(function(){
        $("#close").click(function(){
            $('#frame', window.parent.document).remove();

             });

        });

    </script>


</head> 

<body>
<div id="container-single">
    <button id="close" >Close</button>



    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

        <article <?php post_class('single') ?> id="post-<?php the_ID(); ?>">

            <h1 class="entry-title"><?php the_title(); ?></h1>

            <div class="entry-content">

                <?php the_content(); ?>

                <?php wp_link_pages(array('before' => 'Pages: ', 'next_or_number' => 'number')); ?>

                <?php the_tags( 'Tags: ', ', ', ''); ?>

                <?php include (TEMPLATEPATH . '/_/inc/meta.php' ); ?>

            </div>


        </article>



    <?php endwhile; endif; ?>

    </div>

</body>

Answer 1

执行single.php中加载的iframe下面的代码。这将使用父iframe作为上下文找到window并删除或隐藏它。

//You can call hide() if you want to just hide it
$('#iframe', window.parent.document).remove();

Answer 2

我实际上知道一个小技巧。

在您的父页面上创建一个功能

var closeIFrame = function() {
     $('#iframeid').remove();
}

在iframe中你想要从任何你想要的地方关闭电话

parent.closeIFrame();

整蛊，不是吗？

Answer 3

// Inside the iframe    
frameElement.remove();

Answer 4

我遇到了这个问题，就像Pinterest的Pin It一样创建了一个书签。

它应该跨域工作。

我能解决这个问题的唯一方法是在ifit上的页面和GitHub上的这个例子之后的父页面之间发布事件：

https://gist.github.com/kn0ll/1020251

我已在另一个帖子上发布了答案： https://stackoverflow.com/a/43030280/3958617

希望它有所帮助！

如何从iframe内关闭iframe？

4 个答案: