h5file上傳

『壹』 用html5進行多文件上傳的時候是一次性把所有已選擇文件傳到後台么

html傳多個文件對前端來說是一股腦的提交，但是其實主要還是看後台是如何接收的。後台可以設置一次性接收的文件數據，文件大小等等。其實就和平時的上傳下載是一樣的。
以下載為例：下載的時候，比如用迅雷下載，你的本機是否可以選擇並行下載、逐個下載還可以停止、繼續下載。同樣的，上傳也是一個類似的過程，主要依靠伺服器代碼進行管理設置。本質上，是兩個計算機之間相互傳遞數據流而已。
當然，在默認的時候，伺服器是接收多個文件的，比如javaweb中struts2接收文件默認是接收完所有文件然後再操作的。

『貳』 h5為啥我的圖片上傳在電腦上可以多選，在手機上只能選擇一個， 不能像微信發朋友圈那樣調取相冊選擇多張

你好！
可能是因為開發者在手機上進行了限制，
都是選擇一張。
電腦上你選擇多張，

也只顯示一張。
相關代碼：var file = uploadBth.files[0].
希望對你有幫助。

『叄』 怎樣用html5實現拖拽上傳文件

，首先要判斷拖入的文件是否符合要求，包括圖片類型、大小等，然後獲取本地圖片信息，實現預覽，最後上傳。
$(function(){
...接上部分
var box = document.getElementById('drop_area'); //拖拽區域
box.addEventListener("drop",function(e){
e.preventDefault(); //取消默認瀏覽器拖拽效果
var fileList = e.dataTransfer.files; //獲取文件對象
//檢測是否是拖拽文件到頁面的操作
if(fileList.length == 0){
return false;
}
//檢測文件是不是圖片
if(fileList[0].type.indexOf('image') === -1){
alert("您拖的不是圖片！");
return false;
}

//拖拉圖片到瀏覽器，可以實現預覽功能
var img = window.webkitURL.createObjectURL(fileList[0]);
var filename = fileList[0].name; //圖片名稱
var filesize = Math.floor((fileList[0].size)/1024);
if(filesize>500){
alert("上傳大小不能超過500K.");
return false;
}
var str = "<img src='"+img+"'><p>圖片名稱："+filename+"</p><p>大小："+filesize+"KB</p>";
$("#preview").html(str);

//上傳
xhr = new XMLHttpRequest();
xhr.open("post", "upload.php", true);
xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");

var fd = new FormData();
fd.append('mypic', fileList[0]);

xhr.send(fd);
},false);
});

『肆』 如何使用html5的FileApi上傳大文件

根本不需要那麼麻煩，裝一個擴展就實現了，代碼都不用寫。
AetherUpload-Laravel提供超大文件上傳的Laravel擴展包，支持分組配置、斷線續傳、秒傳等功能，簡單易用，滿足多數人的主流需求，無需編寫適配代碼，幾乎開箱即用。

『伍』 "怎麼把H5上傳的圖片放在資料庫里"

"怎麼把H5上傳的圖片放在資料庫里"
你給的網頁用的是 <input accept="image/*" type="file">，在IOS端點擊時會提示選擇圖片或相機，安卓端要看瀏覽器對這兩個屬性的優化，部分瀏覽器會直接跳轉到資源管理器，優化做得好的可以直接提示選擇相冊或相機。這兩個屬性的用法可以去w3cschool上面看看。

『陸』 如何html5分割上傳實現超大文件無插件網頁上傳

//代碼不支持IE 因為IE對HTML5支持不好$("#file").change(function(event) { var file = $("#file")[0].files[0]; PostFile(file,0); });function PostFile(file,i){ var name = file.name, //文件名 size = file.size, //總大小shardSize = 2 * 1024 * 1024, shardSize = 2 * 1024 * 1024,//以2MB為一個分片 shardCount = Math.ceil(size / shardSize); //總片數 if(i >= shardCount){ return; } //計算每一片的起始與結束位置 var start = i * shardSize, end = Math.min(size, start + shardSize); //構造一個表單，FormData是HTML5新增的 var form = new FormData(); form.append("data", file.slice(start,end)); //slice方法用於切出文件的一部分 form.append("lastModified", file.lastModified); //slice方法用於切出文件的一部分 form.append("name", name); form.append("total", shardCount); //總片數 form.append("index", i + 1); //當前是第幾片 //Ajax提交 $.ajax({ url: "/test/AjaxFile", type: "POST", data: form, async: true, //非同步 processData: false, //很重要，告訴jquery不要對form進行處理 contentType: false, //很重要，指定為false才能形成正確的Content-Type success: function(data){ if(data){ i = data++; var num = Math.ceil(i*100 / shardCount); $("#output").text(num+'%'); PostFile(file,i); } } }); }

『柒』 html5可以通過路徑上傳文件么

這個當然可以 只需要有合適的插件支持即可

『捌』 h5中formdata怎麼添加file

在網路編程過程中需要向伺服器上傳文件。Multipart/form-data是上傳文件的一種方式。 Multipart/form-data其實就是瀏覽器用表單上傳文件的方式。最常見的情境是：在寫郵件時，向郵件後添加附件，附件通常使用表單添加，也就是用multipart/form-d.

『玖』 h5多圖上傳的時候readasdataurl怎麼讀取file

1.var reader = new FileReader(); 2. reader. 3.file); reader.onload = function(e){ 這個地方的代碼有問題，將中間兩行(2,3)的代碼改為： reader.readAsDataURL(file);

『拾』 如何把小程序的校驗文件上傳到H5伺服器裡面

1.先在前端寫一個選擇圖片的區域來觸發wx.chooseImage介面並用wx.setStorage介面把圖片路徑存起來。

-wxml <view class="shangchuan" bindtap="choose">
<image style="width:100%;height:100%;" src="{{tempFilePaths}}"></image>
</view>

<button formType='submit' class="fabu">發布項目</button>123456
/**選擇圖片 */
choose: function () { var that = this
wx.chooseImage({
count: 1,
sizeType: ['original', 'compressed'], // 可以指定是原圖還是壓縮圖，默認二者都有
sourceType: ['album', 'camera'], // 可以指定來源是相冊還是相機，默認二者都有
success: function (res) { var tempFilePaths = res.tempFilePaths
that.setData({
tempFilePaths: res.tempFilePaths
})
console.log(res.tempFilePaths)

wx.setStorage({ key: "card", data: tempFilePaths[0] })
}
})
},123456789101112131415161718
2.使用wx.uploadFile將剛才上傳的圖片上傳到伺服器上12
formSubmit2: function (e) {
var that = this
var card = wx.getStorageSync('card')
wx.uploadFile({
url: app.globalData.create_funds,
filePath: card,

name: 'card',
formData: { 'user_id': app.globalData.user_id, 'person': e.detail.value.person, 'company': e.detail.value.company,
},
success: function (res) {
console.log(res)
}
})
}
}
},