评论：原生js的图片上传插件cupload  [查看原文]

放在表单中，未上传图片，加一下data:判断，数组：[有图]，没图为空！
Cupload 控件不错！
js:      

//未上传图片
var img = "{$edit.img}";
var imgFile = '';
if (img) {
    imgFile = [img];
}
//Cupload上传图片
var upload_img = new Cupload({
    ele: '#upload_img',
    name: "image",
    url: "{:url('admin/upload')}",
    data: imgFile
});

孙中原0
2020/11/8 23:00:22
我var_dump看可以下传过去的POST， 我找到问题了， 你这个，从本机上传的图片，到服务器就加密， 我从服务器直接赋值给 data: 的图片路径， 我再保存，你是没有base64加密的。 太奇葩了

研究员1
2020/11/9 8:43:14
第一次上传的图片是base64的，你可以通过图片上传的方法保存到本地。服务器本地图片上传是上传的路径，这样就避免一张图片上传两次的问题了。你可以通过正则匹配上传的数据，是否为data/image开头，从而使用不同的方法保存

孙中原1
2020/11/9 18:16:38
谢谢解答，最后也是我自己嚼劲脑汁这么干的， 符合正则的解码保存，不符合正则的直接保存路径即可。 其实我想的是， 前端展示出来用户上传的图片后，用户删改以后，点保存修改， 我后台的算法，是先将用户先前储存的图片路径一次性清空。 然后再重新 into 图片路径。 等于现在比以前多了一个else{}。 还有一个问题，就是前端图片展示出来以后， 从后端展示出来的图片，小放大镜放到图片上是会显示服务器文件夹路径的，这样很不安全， 我建议干脆都弄成 base64加密好了。 最最主要的， 的ajax功能不行啊，您再看看，功能是好功能，但是我试了半天也不行。

孙中原0
2020/11/9 18:17:47
DE!!LE!1TE!! 按钮不管用，请再仔细检查下代码

研究员0
2020/11/10 8:30:14
你加我qq42279115 聊吧

研究员1
2020/11/9 8:45:06
这个只提供了一个简单的方法，提供一个思路，你可以自己测试修改

研究员0
2020/11/6 16:04:12
😥我一直用的谷歌浏览器，没这问题，其他浏览器没试过

研究员0
2020/9/25 8:43:22
dele😡te

研究员0
2020/9/4 16:09:00
详细说一下

-爱别离0
2020/9/4 16:43:09
1. 比如我现在选择了几个图片 我现在要提交表单 怎么获取这个准备上传的图片
2. 处了图片 怎么上传PDF等文件 同样提交的时候怎么获取

研究员0
2020/9/4 16:55:42
请看更新说明-3，这个图片上传是和form表单同步上传的，没有添加异步上传，只要设置好name参数，后台可正常接收到base64字符串，base64转存图片可百度。

没有考虑文件上传，估计跑不通

-爱别离0
2020/9/4 17:01:33
cuploadCreate.imageArr 可以获取到base64 但是没有解决同一组图片多次上传问题

研究员1
2020/7/25 11:45:05
图片都存在了字段为image(默认，可通过name值修改)的字段中，以数组的形式，为base64编码的，你可以将base64转为图片存到本地。

西行寺幽幽子0
2020/7/27 14:34:42
大佬，我加上插件动态显示表单后，报错 Cannot read property 'appendChild' of null

研究员0
2020/8/3 9:47:58
这是没找到节点，所以没法添加子节点，具体要看你自己怎么用

研究员1
2020/7/25 11:46:20
可以，需要讲 input的 accept=“image/*”删除，但我没设计文件的展示图片

不服开G秒我?0
2020/6/4 9:33:41
同问

研究员0
2020/7/25 11:50:10
会尽快更新

接上次疑问，附上代码

Image: function(n) {
        event.preventDefault();
        event.stopPropagation();
        uploadFile.splice(n, 1);
        this.imageBox[n].remove();
        this.removeUploadBox();
        if (this.imageList.children.length < this.opt.num) {
            this.createUploadBox()
        }
    },

    removeUploadBox: function() {
        this.uploadBox.remove()
    },

    showImage: function(m) {
        event.preventDefault();
        event.stopPropagation();
        console.log(event.target.tagName);
        let elem = this.image[m];
        this.image[m].style.opacity = 1;
        this.image[m].style.display = 'block';
        $(elem).find('.cupload--btn').css('display', 'block');
    },

    hideImage: function(m) {
        this.image[m].style.opacity = 0;
        this.image[m].style.display = 'none';
        let elem = this.image[m];
        $(elem).find('.cupload--btn').css('display', 'none')
    },