显示效果:

安卓系统上传图片

layui框架实战案例(6):上传图片和视频自动调用IOS或安卓系统的摄像头功能_ide

安卓系统上传视频

layui框架实战案例(6):上传图片和视频自动调用IOS或安卓系统的摄像头功能_上传视频_02

苹果IOS

IOS系统上传图片

layui框架实战案例(6):上传图片和视频自动调用IOS或安卓系统的摄像头功能_上传图片_03

IOS系统上传视频

layui框架实战案例(6):上传图片和视频自动调用IOS或安卓系统的摄像头功能_上传视频_04

layui解决代码

  1. 上传图片
<button class="layui-btn" id="test3" capture="user"><i class="layui-icon"></i>上传图片</button>
  1. 上传视频
<button class="layui-btn" id="test5" capture="user" style="margin: auto 10px;"><i class="layui-icon"></i>上传视频</button>

JS代码

upload.render({
elem: '#test3'
, url: 'safe.php?m=Safe&a=safeUpImg&act=upImg&safe_id=' + safe_id
, multiple: true
, accept: 'file' //普通文件
, number: 6//上传个数
, acceptMime: 'image/*'
, exts: 'jpg|png|bmp|jpeg' //只允许上传压缩文件
, done: function (res) {
}
});
upload.render({
elem: '#test5'
, url: 'safe.php?m=Safe&a=safeUpVideo&act=upVideo&safe_id=' + safe_id
, accept: 'video' //视频
, acceptMime: 'video/*'
, exts: 'mp4|mpg|mov' //只允许上传压缩文件
, done: function (res) {
}
});

重点提示


  1. capture=“user”;
  2. acceptMime: ‘image/*’
  3. acceptMime: ‘video/*’’

Done!