如何通过jQuery删除iframe

Question

I create a iframe in a div by jQuery.Then I load another page(lets say page A.jsp) into that iframe. The page 'A.jsp' has some functionality and end of it, the parent iframe should be removed from the first page when a button in 'A.jsp' is pressed . Loading the page 'A.jsp' into the iframe is OK. but I can't remove the parent iframe. How I tried was, select the parent tag iframe then, remove it. but it didn't work. Here is how I tried.Here $(this) referes to a button in page A.jsp and &('div iframe')referes to the parent iframe

$(this).closest($('div iframe')) .animate({
                                   opacity:0
                               },500,function(){$(this).remove()})

How can I remove the parent iframe ?

Answer 1

This should give you the info you need.

https://stackoverflow.com/a/4689154/897871

Note: the page that hosts the iframe and the page with the content will have to reside on the same host.

Answer 2

The iframe can be fully remove from the DOM by the remove method eg

This is my iframe

<div id="videoPlayerOP" > <iframe id="optionsPlayVideo" width="520" height="348" style="margin-left: 80px;margin-top: 7px;" src="about:blank"></iframe></div>

After loading some source in it, It can be remove by

$($("#optionsPlayVideo").parent()).empty();

If you want to reuse them them append another iframe in it

$('#videoPlayerOP').append('<iframe id="optionsPlayVideo" width="520" height="348" style="margin-left: 80px;margin-top: 7px;" src="about:blank"></iframe>');

Thanks

Answer 3

To which element does this refer to?

To access the iframe you should point to:

parent.document

or

parent.$("iframe")

if you want to use jQuery. Same Origin Policy is always involved here, so pay attention to what you can actually do.

Another solution is to reload the parent page using a simple link that has target="_parent" .

see also here:

How to access parent Iframe from javascript