I have
elm.appendTo('#wrap');
where elm
is a jquery object of the clicked image inside iframe. I want to append that image to a <div id="wrap">
where #wrap
is a div in the body of the page outside iframe. So basically when i double click on an image inside iframe, i want that image to append to <body>
outside iframe. Both body and iframe link are on the same domain.
parent
can be replaced by top
, if the parent document is in the top window):
//If the parent document doesn't have JQuery:
elm.appendTo(parent.document.getElementById("wrap"));
//Only if JQuery is included at the parent
elm.appendTo(parent.$("#wrap"));
parent.$("#wrap").append(elm);
Assume #elm
to be the ID of your image.
// If JQuery is defined at the frame AND the parent (current document)
$("#wrap").append(frames[0].$("#elm"));
frames[0].$("#elm").appendTo($("#wrap"));
frames[0]
refers to the first frame within the current document. If you've set a name
attribute on your frame, you can also use frames.frame_name
, or frames["frame_name"]
.
click
event listener to the elm
JQuery (image) object:
elm.click(function(){
parent.$("#wrap").append(this);
})
Try going at it from the other way: from the parent window, find the element you want to append to and then use .append()
and select the element in the iframe. For example:
$("#wrap").append($("iframe #myElement"));
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With