JS in the use of Formdata upload files, pictures of methods _javascript skills

About Formdata

XMLHttpRequest Level 2 Adds a new interface----FormData

Using the Formdata object, you can use some key-value pairs to simulate a series of form controls, you can use the XMLHttpRequest Send () method to asynchronously submit the form compared with ordinary Ajax, the most advantage of using formdata is that the binary file can be uploaded asynchronously

Formdata objects

Formdata object, you can make a querystring of the name and value of all the form elements and submit to the background. Using the Formdata object can reduce the amount of stitching querystring when submitting using Ajax

QueryString is the query string, and the HTTP query string is in the URL? The value that follows specifies

When a form on a page sends request data to a page in a get manner, such as if the data contains unsafe characters, the browser converts it to a 16-character transfer, such as when the space is converted to% 20 o'clock, and the Web server puts the request data into an QUERY_STRING environment variable. The Request.QueryString method is to remove the corresponding value from this environment variable and convert the character to 16
Uploading files and pictures using Formdata

Create a Formdata empty object, and then add the Key/value using the Append method

var formdata=new formdata ();
 Formdata.append ("name", "John");

If you already have a form form, get the form object and pass in the Formdata object as a parameter

<! DOCTYPE html>
 
 

You can continue to add new key value pairs on the basis of existing form data

var formdata=new formdata ();
 Formdata.append ("Age", "21");

Uploading files using the Formdata object

var formdata=new formdata ($ ("#form1"). [ 0]//Get file Method one
//var formdata=new formdata (); 
Formdata.append ("File", $ ("#file") [0].files[0])//Get File Method two
       $.ajax ({
           type: ' Post ',
           URL: ' # ',
           data: Formdata,
           Cache:false,
           processdata:false,//Do not process the sent data, because the data value is the Formdata object and does not need to be processed
           contenttype:false ,//Do not set Content-type request header
           Success:function () {}
           Error:function () {}
       })

The above is a small set to introduce JS in the use of Formdata upload files, pictures of the method of all the narration, I hope to help you, if you have any questions welcome to my message!