移动端上传图片的方法很简单，使用HTML5中的input:file进行文件上传。
“一”共同属性值：
1.accept：指定上传文件要提交的文件类型。 该属性只能与 type: file 一起使用
例如：
// 这里规定了只接受GIF和JPEG格式图像如果图像的格式不受限制，可以写成如下：
// 不过其实应该避免使用该属性，应该在服务器端验证文件上传2. 多个：上传多个文件，例如选择多张图片一次性上传
《2》上传图片、视频、音频
// 调取图片
// 调取视频
// 调取音频上传文件或图片时，IOS和Android的解释方法有点不同。 多环境测试如下：
安卓：
【微信】： 有capture，调相机； 无capture，相册相机一起调 【QQ】： 有captrue，相册相机一起调； 无capture，调相册 【浏览器】： 有capture，调相机； 无capture，相册相机一起调
iOS：
【微信】： 有capture，调相机； 无capture，相册相机一起调 【QQ】： 有capture，调相机； 无capture，相册相机一起调 【浏览器】： 有capture，调相机； 无capture，相册相机一起调
从上面可以看出，IOS的性能是一样的。 不添加拍照属性时，相册和单反会同时调用。
所以如果想要在任何环境下同时调用相册和单反，只需要在实际开发过程中判断是否是安卓联通设备以及是否处于QQ环境，然后自动添加抓图属性即可。
js判断当前页面是Android/IOS、微信/QQ环境...
【三】读取input上传的图片并显示
知识点：FileReader
// 构造方法
var reader = new FileReader();
// 读取文件中的数据，FileReader提供如下方法：
readAsText(file, encoding); // 以纯文本的形式读取文件，并将读取到文本保存在result属性中。第二个参数指定编码类型，可选
readAsDataURL(file); // 以数据URL的形式读取文件，并保存在result属性中
readAsBinaryString(file); // 读取文件并将一个字符串保存在result属性中，字符串中每一个字符表示一个字节
readAsArrayBuffer(file); // 将一个包含文件内容的ArrayBuffer保存在result中所以，我们使用readDataURL(file)方法来显示图片：
上传图片文件并回显
var input = document.getElementsByTagName('input')[0],
showBox = document.getElementsByClassName('show-box')[0];
input.onchange = function () {
var len = this.files.length; // 对于input上传的图片，使用dom.files可以获取图片信息
for(let i = 0; i < len; i++) {
let fileImg = new FileReader();
fileImg.readAsDataURL(this.files[i]); // readAsDataURL方法将图片转为base64格式存储于result中
fileImg.onload = function() {
let oImg = new Image();
oImg.src = this.result; // 使用FileReader的result属性获取图片base64信息
showBox.appendChild(oImg);
}
fileImg.onerror = function(e) {
console.log('error' + e);
}
}
}
《四》FormData结合ajax上传图片到服务器
知识点：FormData
FormData 对象用于将数据编译为通配符对，以便可以使用 XMLHttpRequest 发送数据。
主要用于发送表单数据，但也可以用于发送通配符对数据html5上传图片，其使用与表单无关，所以有两种方式：
1.不使用form表单，而是使用通配符对表单，在FormData对象中添加数组表单来上传文件
方法：FormData.append()
// append()两个重载函数
formData.append(name, value);
formData.append(name, value, filename); // filename可选
// 还有set()函数，它和append主要区别是：
// append 如果键已经存在，会将新值添加到已有的值集合后面
// set 如果键已经存在，会将新值覆盖原来的值value值可以是Blob或Flie类型的值。
MDN 是这样说的：
其中Blob（binary large object），通俗地讲就是一个大型的二进制对象，可以是图片、音频html5上传图片，而Blob往往是数据库中用来存储二进制文件的数组类型，比如mysql数据库。
我们回到第三个参数。 只有当值为blob或file类型时，才可以添加第三个参数。 当第二个参数为字符串时，会报错：
回到案例，上面的案例我们没有使用form表单，所以我们在“三”的基础上添加了如下代码：
// 我们创建一个FormData对象，然后每获取一个文件，就使用append()方法添加字段
var formData = new FormData();
// ...
fileImg.onload = function () {
// ...
formData.append(files[i].name, files[i]); // 键值对形式 此处append()第二个参数传入的是文件对象File类型
}
// 然后再使用ajax将formData数据传送至服务器2.使用
