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)
}
})
}
}
},