我们相信：世界是美好的，你是我也是。 来玩一下解压小游戏吧！

在移动互联网时代，传统的上传按钮，有了新的变化。点击后，可以调用相册，或者单独调用相机，或者录像等等。下面是几种变化，当然，并不是所有的手机浏览器都支持这几种属性，不过，这种情况在慢慢改善。相关文章：https://newsn.net/say/jquery_ajax_upload.html 。

<input type="file" accept="image/*" /> <!--正常单选-->
<input type="file" accept="image/*" capture="camera" /> <!--照相-->
<input type="file" accept="video/*" capture="camcorder" /><!--录像-->
<input type="file" accept="audio/*" capture="microphone" /><!--录音或照相-->
<input type="file" accept="image/*" multiple="multiple" /><!--多选-->
HTML

苏南大叔：手机浏览器上，上传按钮的几种变化 - input_file
手机浏览器上，上传按钮的几种变化（图6-1）

苏南大叔：手机浏览器上，上传按钮的几种变化 - input_type_01
手机浏览器上，上传按钮的几种变化（图6-2）

普通情况

<input type="file" accept="image/*" /> <!--正常单选-->
<input type="file" accept="image/*" multiple="multiple" /><!--多选-->
HTML

苏南大叔：手机浏览器上，上传按钮的几种变化 - input_type_02
手机浏览器上，上传按钮的几种变化（图6-3）

区别在于，图库是否可以多选。

只调用相片

<input type="file" accept="image/*" capture="camera" /> <!--照相-->
HTML

苏南大叔：手机浏览器上，上传按钮的几种变化 - input_type_03
手机浏览器上，上传按钮的几种变化（图6-4）

只调用录像

<input type="file" accept="video/*" capture="camcorder" /><!--录像-->
HTML

苏南大叔：手机浏览器上，上传按钮的几种变化 - input_type_04
手机浏览器上，上传按钮的几种变化（图6-5）

麦克风（录像或照片）

<input type="file" accept="audio/*" capture="microphone" /><!--录音或照相-->
HTML

苏南大叔：手机浏览器上，上传按钮的几种变化 - input_type_05
手机浏览器上，上传按钮的几种变化（图6-6）

如果本文对您有帮助，或者节约了您的时间，欢迎打赏瓶饮料，建立下友谊关系。
本博客不欢迎：各种镜像采集行为。请尊重原创文章内容，转载请保留作者链接。

 【福利】 腾讯云最新爆款活动！1核2G云服务器首年50元！

 【源码】本文代码片段及相关软件，请点此获取更多信息

 【绝密】秘籍文章入口，仅传授于有缘之人   上传