jQuery does not use plug-ins and swf to achieve refresh-free file upload_jquery

File uploading is a commonly used function on websites, such as the uploading function of attachments or pictures. There are many solutions. Today we introduce a method of uploading files without refreshing through jQuery.

First, we put a form on the page to upload files:

Copy code The code is as follows:

enctype="multipart/form-data" target="asyncTarget">
File:

Then, put an iframe in the page, and only refresh the iframe when uploading, not the entire web page:

Copy code The code is as follows:

Next use js to add functionality to the button:

Copy code The code is as follows:

<script><br> $(function () {<br>            $("#btnUpload").click(function () {<br>                 $("#myForm").submit();<br>         });<br> });<br> </script>

Submit the form when the button is clicked.

This solution can easily implement file upload without refreshing. Its implementation idea is: submit the form to an iframe, and other processing is the same as ordinary form submission.

What needs to be improved in this solution is how to determine when the upload is complete. Currently there is only one idea: monitor the readystate of the iframe through js, and then parse the content of the iframe.