input type=“file” 在移动端H5页面实现调用本地

<input type="file" accept="image/*" mutiple="mutiple" capture="camera" />

三个属性

• accept - 规定可提交的文件类型。
• capture - 系统所捕获的默认设备。camera(照相机)，camcorder(摄像机)，microphone(录音)
• mutiple - 支持多选。当支持多选时，multiple优先级高于capture。

几种写法

1. ios 和 安卓都可以调用摄像头

<input type="file" accept="image/*" mutiple="mutiple" capture="camera" />

2. 在安卓无法调用摄像头

<input type="file" name="upload" accept="image/png,image/jpeg,image/gif" capture="camera"> 

3. 在安卓微信会出现 "No apps can perform this action" ；
   在uc浏览器正常；
   ios能正常使用；
   pc端可以使用。

<input type="file" accept=".gif,.jpg,.png,.jpeg,.bmp" name="file" />

4. 调用相机

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

5. 调用摄像机

<input type="file" accept="video/*" capture="camcorder">

6. 调用录音机

<input type="file" accept="audio/*" capture="microphone">

7. 不加上capture，则只会显示相应的

// 拍照或图库
<input type="file" accept="image/*" >

// 录像或图库
<input type="file" accept="video/*" >

// 录像或拍照或图库
<input type="file" accept="audio/*" >

点击查看原文

本文会持续更新，尽情期待~ 点击查看 好心小萍宝 的全部简书