标签：tip 编辑 提交表单 取图 存储 inpu 事件 预览 失败
需求：可一次上传多张，多次上传；可单张删除；可小图预览；使用七牛云存储图片；非必传；提交表单表单后可重新编辑；
平台：pc，兼容方面主要考虑谷歌浏览器；
思路：1.准备好页面结构input[type]=file mutipul 和 input[type=hidden]
2.用户每次选取图片后
2.1用户点击input但没有选取图片，无论是否触发change事件，无操作；
2.2用户点击input但选取图片和上一张相同，不触发change事件，无操作；
2.3用户点击input选取图片并排除以上两种情况后，准备formData空对象，获取files并遍历append进formData的files中（files是我们公司前后台自定的），请求上传七牛云，获取路径；
2.4请求成功（statas=success），提醒上传成功，处理返回的图片路径字符串来显示图片（并每张图附带一个删除标志），将图片路径处理成数组放入input[type=hidden]；请求失败，提示上传失败，请重试；
3.用户点击删除标志，删除当前单张图片，并将当前路径从input[type=hidden]的值中剔除；
4.点击提交表单，请求后台，隐藏删除标志；
5.用户重新编辑，显示删除标志，重复步骤三；
6.用户再次提交表单。重复步骤四；
哪里考虑不周全请指出，感谢！
标签：tip 编辑 提交表单 取图 存储 inpu 事件 预览 失败
原文地址：https://www.cnblogs.com/Merrys/p/9032007.html
