Accessing Iframe content using jquery on IE

Question

I am trying to upload a file using an hidden Iframe and get the response back. The following code works fine on Firefox but breaks on IE. It fails on getting the response back.

Line....
var content = $j(this).contents().find("body:last").text();

Any help/suggestion is deeply appreciated. Thanks.

$j('#uploadForm').submit(function(e) {

        var jThis = $j('#uploadForm');
        var strName = ("uploader" + (new Date()).getTime());
        var jFrame = $j("<iframe id=\"" + strName + "\" name=\"" + strName + "\" src=\"about:blank\" />");
        jFrame.css("display", "none");

        jThis
                .attr("method", "post")
                .attr("enctype", "multipart/form-data")
                .attr("encoding", "multipart/form-data")
                .attr("target", strName)
                ;

        $j("body:first").append(jFrame);

        jFrame.load(function(objEvent) {
            var content = $j(this).contents().find("body:last").text();
            alert(content);

    });
});

Answer 1

I don't think JQuery has a more specific method to abstract away the differences in IFRAME implementation. I'm also not sure if the JQuery methods can be called on DOM elements in a document (your IFRAME) that doesn't itself have a reference to JQuery. So, I'd try something like this:

    var d = $j(this);
if(d.body) {
    return d.body.innerHTML;
    }
else if(d.innerHTML) {
    return d.innerHTML;
    }
else {
    return 'Frame has no body';
    }

Answer 2

Try this:

jFrame.load(function(objEvent) {
    var content = $(this.contentWindow.document.body).html();
    alert(content);
});