iframe上传浏览器兼容性

Question

I'm uploading a csv file using the iframe approach. I was hoping that it would allow me to not have the redirect of the page on a normal form submittal.

HTML:

<section id=fileImport>
    <form id="importForm" target="postiframe" name="Import" enctype="multipart/form-data">
            <input name="import-input" id="importInput" type="file" />
            <button id="importBtn" class="btn btn-large">Import</button>
        </form>
</section>

javascript:

var iframe = $('<iframe name="postiframe" id="postiframe" style="display: none" />');
                this.$("#fileImport").append(iframe);

            var form = $("#importForm");
            form.attr("action", "import/upload");
            form.attr("method", "post");
            form.attr("enctype", "multipart/form-data");
            form.attr("encoding", "multipart/form-data");
            form.attr("target", "postiframe");
            form.submit();

            var self = this;
            this.$("#postiframe").load(function () {
                var iframeContents = $("#postiframe").get(0).contentWindow.document.body.innerHTML;
                self.parseResponse(iframeContents);
            });

enter code here

This is my first attempt at using this iFrame approach. I thought in parseResponse I could just take the data that comes back in the pre tags.

eg

<pre>{myData: "blah"}</pre>

I was doing that with:

var re = new RegExp("<pre>(.*?)</pre>");
            var matches = response.match(re);

And that worked for Firefox. Then when I tried it in chrome, chrome sends the data back with stuff like

<pre style="width:....">{myData: "blah"}</pre>

I was wondering if there was a way to get the data back without the pre tags, or a way to possibly parse it amongst the different browsers. I haven't tried it on IE 9, but I can only imagine it being harder than chrome & firefox. Any thoughts?

Is using an iframe like this to upload data still used? (We have to support IE 9, so I can't use the html 5 stuff).

Answer 1

Cross domain upload?

If so, you need a redirect page to receive result from query string.

If not, do not use iframe upload, http://jquery.malsup.com/form/ , here is a plugin help to post form async.