Comment télécharger et prévisualiser des images en combinant thinkphp5 et Layui (code)

Le contenu de cet article explique comment implémenter le téléchargement et la prévisualisation d'images (code) en combinant thinkphp5 et Layui. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

code html

<div class="layui-upload">
   <button type="button" class="layui-btn" id="cover">上传封面</button></div> <div class="layui-input-inline">
   <img id="preview" width="200px" height="200px"></div>

code js

var uploadInst = upload.render({
      elem:'#cover'
      ,url:'addCourse'
      ,accept:'file'  // 允许上传的文件类型
      ,auto:true // 自动上传
      ,before:function (obj) {
          console.log(obj);
          // 预览
          obj.preview(function(index,file,result) {
              // console.log(file.name);    //图片名字
              // console.log(file.type);    //图片格式
              // console.log(file.size);    //图片大小
              // console.log(result);    //图片地址
              $('#preview').attr('src',result); //图片链接 base64
          });
          // layer.load();
      }
      // 上传成功回调
      ,done:function(res) {
          // console.log(upload);
          console.log(res);
          
      }
      // 上传失败回调
      ,error:function(index,upload) {
          // 上传失败
      }
      
  });

interface php

$file = request()->file('file');
 // 移动到框架应用根目录/public/uploads/ 目录下
 $info = $file->move('public/upload/');
 if ($info) {
     $path = 'public/upload/'.$info->getSaveName();
     return return_succ($path);
 }

Recommandations associées :

PHP - téléchargement d'image html télécharger le code d'image plugin de téléchargement d'image php php télécharger le code d'image

Implémentation simple de PHP+ajax téléchargement d'image mvc ajax téléchargement d'image jquery ajax téléchargement d'image php ajax téléchargement d'image

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!