html5上传图片IOS系统和Android系统下均显示摄像头拍照和图片选择


本文摘自PHP中文网,作者巴扎黑,侵删。

最近在做信开发时,发现<input type="file" />在IOS中可以拍照或从照片图库选择,而Android系统则显示资源管理器,无拍照选项,网上查找资料,改为<input type="file" capture="camera">后,Android可显示相机和文档,但IOS则只有拍照选项了,最后通过判断设备类型使在IOS和Android下均可以显示拍照和图库选择,代码如下:

1

2

3

4

5

6

7

8

var u = navigator.userAgent, app = navigator.appVersion; 

var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android终端或者uc浏览器 

var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端 

//alert('是否是Android:'+isAndroid); 

//alert('是否是iOS:'+isiOS);

 if(isAndroid){

          $ ("input[name='file']").attr('capture','camera');

 }

安卓效果

IOS效果

以上就是html5上传图片IOS系统和Android系统下均显示摄像头拍照和图片选择的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

h5虚拟键盘挡住输入框怎么办

html5面向对象的游戏开发简单实例分享

全面解析html5的文档结构和新增标签

html5 虚拟键盘出现挡住输入框怎么办

带你认识html57个混合式移动开发框架

html5 command标签的用法和<command>标签的使用案例详解

html5前景怎么样

教你用html5画一个馋人的西瓜

自定义实现可以播放暂停、进度拖拽、音量控制及全屏的h5播放器

html中文本标签,超链接标签以及图像标签的简单介绍

更多相关阅读请进入《Android》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...