基于layui 图片截取（剪裁）上传图片，主要用于用户头像上传

最新推荐文章于 2025-09-24 14:19:48 发布

原创

最新推荐文章于 2025-09-24 14:19:48 发布 · 6.4k 阅读

13 ·

CC 4.0 BY-SA版权

文章标签：

#基于layui 图片截取（剪裁）上传图片，主要用于用户头像上

本文介绍了一个用户自定义头像裁剪功能的实现过程，包括前端使用layui和croppers插件进行图片上传及裁剪，后端通过PHP处理上传的图片并返回裁剪结果。

在开发中，可能会遇到一些需求，比如，在用户上传头像时，根据自己的图片大小进行截取；

账号和密码：he 123456

体验地址：
blog.itxkf.cn/admin/login/login

具体功能：

在：

效果如下：

代码如下：

 <div class="layui-form-item">
                <label class="layui-form-label">管理员头像</label>

                <div class="layui-input-block">
                    <div class="layui-upload">
                        <button type="button" class="layui-btn" id="test1" data-src="{$find.admin_logo}">上传图片</button>