(thinkphp5代码大全)(thinkphp5.1开发手册)

本文主要演示的是基于ThinkPHP5+layui框架，以文章相册图集为例，实现多图上传以及预览。本案例中通过实现EY内容管理系统的文章发布功能中的相册图集功能，使用layui框架的文件上传模块实现多图上传以及展示，在《》中有关于文章缩略图的上传。

第一步，在文章发布页面实现相册图集的HTML代码，这里仅做展示，相关代码如下：

文章发布页面实现相册图集的HTML代码

基于ThinkPHP5和layui，以文章相册图集为例，实现多图上传及预览

第二步，写几行CSS代码，不至于图片上传之后页面乱的惨不忍睹。

基于ThinkPHP5和layui，以文章相册图集为例，实现多图上传及预览

第三步，通过layui框架的upload模块，执行多图上传的实例，相关的JS代码如下：

通过layui框架的upload模块，执行多图上传的实例

多图上传中，我使用的文件上传接口与单图上传一致，具体可以参考《，不多解释。我觉得需要解释的是多图上传中我定义了一个i和j来区分上传的每一个文件，因为layui的form模块暂不支持input的数组提交。

第四，上传几张图看一下多图上传后的效果：

基于ThinkPHP5和layui，以文章相册图集为例，实现多图上传及预览

关于图片的信息如下：

基于ThinkPHP5和layui，以文章相册图集为例，实现多图上传及预览，上传效果

第五，在文章发布提交的方法中处理图片信息，并提交到数据库。我用了一个thumbs_count来告诉后台程序究竟上传了几个文件，其实不这么做也可以的。

相关链接：