鍍金池/ 問答/Java  HTML/ input file上傳的文件怎么通過ajax傳給后臺?

input file上傳的文件怎么通過ajax傳給后臺?

input file上傳的文件怎么通過ajax傳給后臺?求解,謝謝!

回答
編輯回答
陌離殤

file在change的時候把選擇的圖片的File給push進數(shù)組,提交時new FormData(),循環(huán)數(shù)組,通過formData.append添加到formData 中,參考我的博客吧鏈接描述

<input type="file" class="hidden"  id="file"  multiple="multiple"/>
var filearr = [];
var myfile = document.getElementById('file');
myfile.onchange = function(){
    var files = this.files; 
    for(var i = 0;i<files.length;i++){                
         filearr.push(files[i]);
    }
}

sub提交

function sub(){        
    var formData = new FormData();                
    for(var i =0;i<filearr.length;i++){    //提交時,我們把filearr中的數(shù)據(jù)遍歷一遍
        formData.append("upfile[]", filearr[i]); //用append添加到formData中,就得用戶最終要提交的圖片了,多張的話[]必須    
    };


    formData.append("aaa", 111);    
    var request = new XMLHttpRequest();                 
    request.open("POST", "1.php",true);
    request.onreadystatechange = function(){                    
        if(request.readyState==4){                        
            
        }
    };                          //注意一定不要設(shè)置request.setRequestHeader
    request.send(formData);
}

ajax的話要處理一下

    $.ajax({
          url: "1.php",
          type: "POST",
          data:formData,
          cache:false,         //不設(shè)置緩存
          processData: false,  // 不處理數(shù)據(jù)
          contentType: false   // 不設(shè)置內(nèi)容類型
    });    
2017年2月20日 09:31
編輯回答
尤禮

可以通過formData

//頁面
<input type="file" name="pic"  id="pic">
//js
var formData = new FormData();
formData.append("picture",document.getElementById("pic").files[0]);
$.ajax(url,formData,function(res){});
2017年8月18日 08:22