The Formdata object is facilitated for serializing tables and for creating the same data as the form format, which is, of course, for XHR transmissions.
Today we use Dropzone and formdata to implement multi-file upload capabilities.
var SAMP = null; Dropzone object SAMP = new Dropzone ("#dropzone", { URL: "#", //Background response link maxfiles:4,/ / The maximum number of files that can be transferred is currently set to 1 maxfilesize:2048,//File size limit acceptedfiles: ". Png,.jpg,.gif,.jpeg,.bmp",// File format Restrictions Autoprocessqueue:false, //files are automatically passed back to background myawesomedropzone:false, })
We set the file not to upload automatically, but through the control button to implement the upload function. First we create a Dropzone object, set the maximum number of uploaded files, file size, and so on.
var myformdata = new FormData ()
Create a form data object
Samp.on ("Addedfile", function (file) { myformdata.append (file.name, file)})
Registers the Addedfile event with the Dropzone object, and when the file is uploaded, the append () function of the Formdata object is the addition of the image object to the Myformdata pairs in the form of a key-value pair.
$.ajax ({
Type: ' POST ', url: "/upload-img/", Data:myformdata, processdata:false,//* must write contenttype:false,//* must write
Success:function (data) {
...
},
Error:function (XMLHttpRequest, Textstatus, Errorthrown) {
...
}
});
When using the Formdata object to pass data through Ajax to the background, you must set the "Processdata:false,contenttype:false," two items in the option, or you will get an error.
processData
Set to false
. Because the data
value is an FormData
object, you do not need to process the data.
contentType
set to false
. This is set to false because it is an <form>
object constructed by a form, and the FormData
property has already been declared enctype="multipart/form-data"
.
Formdata upload multiple images, learn to use Formdata