添加链接
link之家
链接快照平台
  • 输入网页链接,自动生成快照
  • 标签化管理网页链接

移动端 input[type=file]标签 本地文件、拍照、录像 上传的兼容性问题: https://blog.csdn.net/sinat_35538827/article/details/85997205 https://blog.csdn.net/weixin_34101229/article/details/88696293

问题描述:移动端上传文件,可以选择  本地文件、拍照、录像、录音。但是他们不是同时可以选择的,不同的手机还是有差异的。

一、input[type=file] 属性: https://blog.csdn.net/sinat_35538827/article/details/85997205

三个属性:

1、accept - 规定可提交的文件类型。

2、capture - 系统所捕获的默认设备。camera(照相机),camcorder(摄像机),microphone(录音)

3、mutiple - 支持多选。当支持多选时,multiple优先级高于capture。

二、不同环境中  input[type=file] 不同属性对应的效果:(主要的运行环境:ios浏览器、ios微信网页、安卓浏览器、安卓微信网页)

1、<input type="file">

ios浏览器 ios微信 安卓浏览器(左边小米手机,右边魅族手机)

个人得出结论:

ios上基本表现一致,且根据属性设置。可以实现定制,拍照和录像  是 都有还是  选择其一

安卓机上就有很大差异,大部分的安卓机都是不能实现 弹出窗上同时有  拍照和录像 功能的。 如果要实现 拍照和录像功能都可以的话,弹出选择的组件使用H5自己写。选择选项后,js对 input[type=file] 标签的属性修改。如,

点击自定义的拍照选项后,直接跳到拍照功能(不弹出原生的选项组件)。

三、小程序中的H5的 input[type=file] 和 微信H5页面的表现也是不一样的。

安卓微信小程序中 要调用 拍照或录像 必须设置 capture="camera" 属性 ,且直接进入拍照或 录像中。