标签:上传图片 dem 技术 表示 route lan upload 开始 提示
官方文档入口:https://www.layui.com/doc/modules/layedit.html#uploadImage
先看效果图片:
开始上代码了 前端代码
1 <div class="layui-input-block"> 2 <textarea id="demo" style="display: none;"></textarea> 3 </div>
js代码
1 layui.use(‘layedit‘, function(){ 2 var layedit = layui.layedit; 3 layedit.set({ 4 uploadImage: { //上传图片的设置 5 url: ‘{{route(‘admin_upload_layui_img‘)}}‘ //接口url 6 ,type: ‘post‘ //默认post 7 } 8 }); 9 layedit.build(‘demo‘); //建立编辑器 10 });
php后台上传图片的接口
1 /** 2 * layui上传图片 上传到本地服务器 3 * hinq 2020 03 03 4 * 5 */ 6 public function uploadLayuiImg() 7 { 8 if ($_FILES["file"]["error"] == 0) { 9 //这里是上传图片处理代码 网上有跟多 我就不写注释了 10 $fileUrl = ‘upload/imgs‘; 11 $dir = iconv("UTF-8", "GBK", $fileUrl); 12 if (!file_exists($dir)) { 13 mkdir($dir, 777, true); 14 } 15 $suffix = ‘.‘ . pathinfo($_FILES["file"]["name"], PATHINFO_EXTENSION); 16 $picUrl = $fileUrl . ‘/‘ . self::GetRandStr() . $suffix; 17 move_uploaded_file($_FILES["file"]["tmp_name"], $picUrl); 18 19 //返回参数是官网规定的格式 20 $data = [ 21 "code"=> 0 //0表示成功,其它失败 22 ,"msg"=> "" //提示信息 //一般上传失败后返回 23 ,"data"=> [ 24 "src"=> $picUrl 25 ,"title"=> $_FILES["file"]["name"] //可选 26 ] 27 ]; 28 echo json_encode( $data ); 29 } else { 30 echo json_encode([‘code‘ => ‘1‘, ‘url‘ => ‘‘]); 31 } 32 }
到这里layui编辑器(layedit) + 上传图片的功能就好了
标签:上传图片 dem 技术 表示 route lan upload 开始 提示
原文地址:https://www.cnblogs.com/hinq/p/12402045.html