views:

1366

answers:

1

I have this code:

  <script type="text/javascript">
    $(document).ready(function() {
        $("#iframeId").contents().find("body").append($("#test"));
    });
  </script>
  <iframe id="iframeId" name="iframeId" src="about:blank" ></iframe>
  <div id="test">
     Text
  </div>

And i need to append whole object to iframe (not only the html()). It works well in IE, Firefox and Opera, but I can't make it going in Chrome/Safari. Is there any hack or other way, how to put html object into the iframe, working with WebKit?

EDIT

I can't clone the object (or use its inner Html), because I need to use it with file input and I can't copy it due to security restrictions.

A: 

outerHTML. This example works fine:

jQuery.fn.outerHTML = function() {
    return $('<div>').append( this.eq(0).clone() ).html();
};

$("#iframeId").contents().find("body").html($("#test").outerHTML());
$("#test").remove();

--EDIT

  <script type="text/javascript">
    $(document).ready(function() {
     $("#iframeId").contents().find("body").html($("<div></div>").append($("#test")).html());
    });
  </script>
  <iframe id="iframeId" name="iframeId" src="about:blank" ></iframe>
  <div id="test">
     Text
  </div>

--EDIT II

$("#iframeLast").contents().find("body").append($("<form></form>").append($("#inputLast")));
andres descalzo
But this clone the object, I need to use the code in form with file input, so I am not able to copy/clone it.
TomT
Something like this could serve?
andres descalzo
Still not, it doesn't append input with its value. I've made test page with your suggestions, you can find it here: http://www.reznicci.cz/appendProblem/index.html. If you choose any file and click the button, it should move the input into the iframe and alert its value. It works in IE, FF and Opera, but doesn't in Safari/Chrome.
TomT
I worked with this modification in the "last one"
andres descalzo
Yes, it works great! Thanks a lot!
TomT