脚本宝典收集整理的这篇文章主要介绍了H5(移动端)前端使用input type=file 上传图片，调用相机和相册，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。
<input class="addPicInput" type="file" ref="uploaDFile"
@change="fileChange" accept="image/*" multiple>在移动端页面使用上传文件或者图片时，IOS和安卓的展现方式有很多不一样。
input 有 captrure属性，取值：camera：相机；camcorder：摄像；microphone：录音
在安卓想要调用相机需要添加capture属性，于是我在IOS和AndROId上进行了三端测试!
结果如下：
1. 安卓：
【微信】： 有capture，调相机； 无capture，相册相机一起调
【QQ】： 有captrue，相册相机一起调； 无capture，调相册
【浏览器】：有capture，调相机； 无capture，相册相机一起调
2. IOS
【微信】： 有capture，调相机； 无capture，相册相机一起调
【QQ】： 有capture，调相机； 无capture，相册相机一起调
【浏览器】：有capture，调相机； 无capture，相册相机一起调
我们可以看见，IOS表现行为一致，只要不加capture就可正常使用
而在Android上 QQ表现不一致，于是在实际开发中，我们只需要判断
if (isAndroid && type === 'qq') {
this.$refs.uploadFile.setattribute('capture', 'camera');
}over！
以上是脚本宝典为你收集整理的H5(移动端)前端使用input type=file 上传图片，调用相机和相册全部内容，希望文章能够帮你解决H5(移动端)前端使用input type=file 上传图片，调用相机和相册所遇到的问题。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。