input[type=file]上传图片的兼容问题

最新推荐文章于 2024-08-30 14:50:04 发布

KeroroLX

最新推荐文章于 2024-08-30 14:50:04 发布

阅读量617

点赞数

CC 4.0 BY-SA版权

文章标签： ios file 调用相机

本文链接：https://blog.youkuaiyun.com/github_38928905/article/details/113368438

这段代码展示了在系统浏览器和微信环境下，HTML的文件输入标签(inputtype=file)在处理普通文件选择、相机访问、文件类型限制以及多选功能时的不同行为。在Android和iOS上，某些功能如仅相机访问或仅文件选择存在平台特定的限制。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

环境：系统浏览器
先测试一段代码：

<h2>普通</h2> 可多选
<input type="file" />

<h2>相机</h2> Android仅文件  iOS仅相机
<input type="file" capture="camera" />

<h2>文件</h2> 可多选
<input type="file" accpet="image/*" />

<h2>相机文件</h2> Android仅文件 iOS仅相机
<input type="file" accpet="image/*"  capture="camera"/>

<h2>多选</h2> 多选
<input type="file"  mutiple="mutiple"/>

<h2>多选相机文件</h2> Android仅文件  iOS仅相机
<input type="file" accpet="image/*"  capture="camera"  mutiple="mutiple"/>

<h2>文件类型</h2> 可多选
<input type="file" accpet="image/png,image/jpeg,image/jpg" />

<h2>相机文件类型</h2> Android仅文件 iOS仅相机
<input type="file" capture="camera" accpet="image/png,image/jpeg,image/jpg" />

<h2>相机文件多选</h2> Android仅文件 iOS仅相机
<input type="file" mutiple="mutiple" capture="camera" accpet="image/png,image/jpeg,image/jpg" />

环境：微信

<h2>普通</h2> Android仅文件   iOS可多选
<input type="file" />

<h2>相机</h2> Android仅文件  iOS仅相机
<input type="file" capture="camera" />

<h2>文件</h2> 可多选
<input type="file" accpet="image/*" />

<h2>相机文件</h2> Android仅文件 iOS仅相机
<input type="file" accpet="image/*"  capture="camera"/>

<h2>多选</h2> 多选
<input type="file"  mutiple="mutiple"/>

<h2>多选相机文件</h2> Android仅文件  iOS仅相机
<input type="file" accpet="image/*"  capture="camera"  mutiple="mutiple"/>

<h2>文件类型</h2> 可多选
<input type="file" accpet="image/png,image/jpeg,image/jpg" />

<h2>相机文件类型</h2> Android仅文件 iOS仅相机
<input type="file" capture="camera" accpet="image/png,image/jpeg,image/jpg" />

<h2>相机文件多选</h2> Android仅文件 iOS仅相机
<input type="file" mutiple="mutiple" capture="camera" accpet="image/png,image/jpeg,image/jpg" />