如何点击iframe删除它？ [英] How to click on an iframe to remove it?

问题描述

我得到了最基本的问题。我想在div中选择iframe。无论何时点击此iframe，我都想删除iframe。我该怎么做？

Well I got the most basic question. I want to select the iframe within the div. And when this iframe is clicked no matter where, I want to remove the iframe. How can I do this?

<div id="box">
    Random thoughts
    <iframe src=""></iframe>
</div>

见这里： http://jsfiddle.net/nT4uZ/1/

推荐答案

你不能直接@Daedalus评论说，正确处理iframe内部的点击。

You cannot directly handle the click inside of an iframe as correctly @Daedalus commented.

你需要在 #box div中添加一个额外的div，它将覆盖iframe，它将处理iframe上方的点击。

You need top put an extra div inside the #box div which it will cover the iframe and it will handle the click above the iframe.

您需要找到iframe的尺寸及其偏移量，并将其应用于此div中。

You need to find the dimensions of the iframe and its offset and apply those in this div.

HTML

<div id="box">Random thoughts
    <iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FFacebookDevelopers&amp;width&amp;height=62&amp;colorscheme=light&amp;show_faces=false&amp;header=false&amp;stream=false&amp;show_border=true&amp;appId=163663917164005" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:62px;" allowTransparency="true"></iframe>
    <div id="inner_box">
    </div>
</div>

CSS

    #inner_box {
        position:absolute;
        z-index:2; 
   }
    #iframe {
        position:absolute;
        z-index:1; 
    }

JavaScript （在链接的帮助下< a href =https://stackoverflow.com/questions/15104538/how-to-position-a-div-at-the-top-of-another-div-with-javascript>这里）

//Positioning the #inner_box in the same position with the iframe
var destination = jQuery('#box iframe').offset();
jQuery('#inner_box').css({top: destination.top, left: destination.left});

//Giving the #inner_box the same dimensions with the iframe
jQuery('#inner_box').width(jQuery('#box iframe').width());
jQuery('#inner_box').height(jQuery('#box iframe').height());

//Implement click handler
jQuery('#inner_box').click(function() {
    jQuery(this).closest('#box').find('iframe').remove();
});

这里是代码的小提琴。

这篇关于如何点击iframe删除它？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！