欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

【PHP项目】产品新增的多图上传

程序员文章站 2022-06-27 14:30:03
产品新增:多图上传 1:html的更改 在 type=file的input框中添加multiple="multiple" name属性中必须添加[] ,否则$_FILES只能接收最后一张 新添加
    标签,该标签用来显示上传的图片 2:js的更改 循环将每张 ......

    产品新增:多图上传

    1:html的更改

    在 type=file的input框中添加multiple="multiple" name属性中必须添加[] ,否则$_FILES只能接收最后一张

    新添加<ul class="images"></ul>标签,该标签用来显示上传的图片

     

    2:js的更改

    循环将每张图片进行监听,监听完毕之后将每张图拼接到对对应的li中,将li追加到 .images目标元素内部的后面

    代码:

    var str="<li>"; //e.target.result就是最后的路径地址

    str+="<img src='"+e.target.result+"'/>"; //表示图片

    str+="<input type='hidden' name='check_images[]' value='"+j+"'/>"

    //用来存储需要添加的图片的下标,功能:后期在php页面用来确定该图片是否被手动删除

    str+="<div><img class='delete' src='resources/images/fancy_close.png'/></div>";

    //实现图片的删除功能

    str+="</li>";

    $(".images").append(str);

    点击对应的delete将对应的li删除,remove()

     

    3;php文件更改:

     

    a: 通过判断$_POST["check_images"] 确定是否有图片新增 ,定义数组$images用来存储需要上传的图片

    b:如果有新图片,循环判断$_FILES中的文件是否有被手动删除

    c: 如果没有被删除 下面执行的代码功能:

    定义数组$images $thunb_images $water_images 用来存放原图 缩略图 水印图

    判断文件的格式 判断文件的大小

    将图片从临时路径中转移到永久路径中

    将图片新的路径保存到$images数组中

    调用缩略图函数,然后将缩略图的路径存放在$thunb_images数组中

    调用水印图函数,然后将水印图的路径存放在$water_images数组中

    d:循环完之后,

    将$images,数组转化为json格式的字符串 追加到$_POST["images"]中

    将$thumb_images,数组转化为json格式的字符串 追加到$_POST["thumb_images"]中

    将$water_images,数组转化为json格式的字符串 追加到$_POST["water_images"]中

    e:新增,新增成功跳转,新增失败,提示错误信息

     

     

    多图上传 删除:

    1:判断是否有传递id

    2:如果有对应的id,先查询id对应的记录$arr

    3:将id对应的记录删除

    4:如果删除成功,将$arr表示图片的元素(包括原图 缩略图 水印图)由字符串转化为数组形式

    5:循环表示图片的数组,将图片依次删除 unlink("文件的路径"),删除完之后跳转

     

     

    多图修改: (添加水印图 缩略图)

    1: html的更改

    在 type=file的input框中添加multiple="multiple" name属性中必须添加[] ,否则$_FILES只能接收最后一张

    在对应位置添加ul,在ul中添加通过foreach循环li,将产品对应的原图循环显示在页面中,每一张图都对应一个隐藏域,该隐藏域添加name= "ready_check_image[]" ,并设置value的值,值为每一张图片的下标

     

    2:js的更改

    当type=file的内容改变之后,将上传的每一张图片显示ul的li中,每一张图片设置隐藏域,隐藏域添加neme="check_image[]" ,并设置value值,值为每一站图片对应的下标

     

    3:php的更改:

    a:定义$images数组 $thumb_images数组 $water_images 数组

    //处理修改中新增图片的步骤

    b: 判断是否有上传新的图片,通过判断$_POST["check_image"]是否为空进行判断

    如果有新图片,循环判断$_FILES中的文件是否有被手动删除

    如果没有被删除 下面执行的代码功能:

    定义数组$images $thunb_images $water_images 用来存放原图 缩略图 水印图

    判断文件的格式 判断文件的大小

    将图片从临时路径中转移到永久路径中

    将图片新的路径保存到$images数组中

    调用缩略图函数,然后将缩略图的路径存放在$thunb_images数组中

    调用水印图函数,然后将水印图的路径存放在$water_images数组中

     

    //处理修改中产品对应原图片的步骤

    判断$_POST["ready_check_images"] 是否为空

    条件: 不为空, 代表有原图则判断原图中是否有图片被删除

    如果原图被删除,

    从文件夹中删除原图 删除对应的水印图 删除对应的缩略图

    如果原图没有被删除,

    则将原图对应的路径存储在$images数组中

    将缩略图对应的路径存储在$thumb_images数组中

    将水印图对应的路径存储在$water_images数组中

     

    为空,判断原图存在,代表将原图所有的图片全部删除

    从文件夹中删除原图 删除对应的水印图 删除对应的缩略图

    c:上述流程执行完之后,

    将$images,数组转化为json格式的字符串 追加到$_POST["images"]中

    将$thumb_images,数组转化为json格式的字符串 追加到$_POST["thumb_images"]中

    将$water_images,数组转化为json格式的字符串 追加到$_POST["water_images"]中

    d:新增,新增成功跳转,新增失败,提示错误信息