今天剛學會一種上傳圖片方法,以前都是用form表單或者上傳圖片的插件來上傳圖片,使用H5自帶的FormData()來上傳圖片,別的很少說了,來看代碼吧!!!javascript
1.這個是body中內容html
<input type="file" id="file"> <button id="btn">上傳</button>
2.js:當點擊上傳按鈕時,向後臺發送圖片上傳請求java
$("#btn").on('click',function(){ var file = $("#file").get(0).files[0]; console.log(file); var formData = new FormData();//* formData.append("image1",file);//* $.ajax({ type:'post', url:'http://192.168.101.88:8080/addAD.do', data:formData, processData:false,//* contentType:false,//* success:function(data){ console.log(data); } }) })
《===========當input file中的值發生改變時,也可上傳圖片,獲取files的值=========》ajax
$("#file").on('change',function(){ console.log(this.files); console.log(this.files[0]); })
《=====================獲取formData的值,以下:==================》app
var formData = new FormData(); formData.append("img",1); for(var i=0;i<6;i++){ formData.append("image"+i,0); } //獲取單張圖片 console.log(formData.get("img")); //獲取對應的key與value的值 for (var [a, b] of formData.entries()) { console.log(a, b); } //獲取每一個key的值 for (var value of formData.values()) { console.log(value); }