zoukankan      html  css  js  c++  java
  • 【PHP项目】产品新增的多图上传

    产品新增:多图上传

    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:新增,新增成功跳转,新增失败,提示错误信息

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

    一切所谓的努力在成功之前都是一钱不值。
  • 相关阅读:
    ARC 没有自动释放内存
    查看python的路径
    django 一些库
    实现点击按钮,出现隐藏布局
    蓝牙的开启以及搜索
    退出当前程序(应用)的小提示
    删除SharedPreferences的存储记忆
    BaseAdapter和SimpleAdapter的区别
    数据类型
    交互与注释
  • 原文地址:https://www.cnblogs.com/kernel123/p/9398333.html
Copyright © 2011-2022 走看看