WEB APP 调用相册上传和拍照上传的实现

WEB APP通过手机浏览器调用手机相册和手机相机。

实现原理

利用input标签的type="file"类型实现，相册和直接调用相机的属性分别如下：

相册：accept="image/*"

代码:<input type="file" accept="image/*" multiple>

注：点击后为多项选择，其中一项为相册，也包括了相机，添加了multiple可以选择多张图片。

相机：capture="camera"

代码：<input type="file" accept="image/*" capture="camera">

注：相机在accept="image/*" 的基础上添加capture="camera"

最后通过样式隐藏掉原来的input，然后用小图标代替，使用标签将input包裹起来，这样点击小图标就能点击到input了，（隐藏input主要是设置透明度为0.0）

效果图如下：

代码实例

HTML：