21
2020
08

如何修改UEditor百度编辑器按图片选择的顺序排列上传多图

【前言】最近用百度UEditor编辑器上传图片时,发现不能按照图片的顺序进行排列,经过一番折腾,其实只需几步简单的配置即可,废话不多说,入正题。

平时我们做站点的时候,用的最多的就是百度UEditor编辑器,用UEditor的多图上传时,编辑器会按照上传成功的先后顺序来排列图片。那么如果想修改为按照选择图片的先后顺序进行排列应该如何修改呢?

解决方法:

修改 ueditor/dialogs/imag/image.js文件

找到_this.imageList.push(json);替换成_this.imageList[$file.index()] = json;(注意标点符号)

为了防止出现问题,可以将以下文件进行备份或者注释:

uploader.on('uploadSuccess', function (file, ret) {
    var $file = $('#' + file.id);
    try {
        var responseText = (ret._raw || ret),
            json = utils.str2json(responseText);
        if (json.state == 'SUCCESS') {
            //_this.imageList.push(json);
            _this.imageList[$file.index()] = json;
            $file.append('<span class="success"></span>');
        } else {
            $file.find('.error').text(json.state).show();
        }
    } catch (e) {
        $file.find('.error').text(lang.errorServerUpload).show();
    }
});

修改:ueditor/dialogs/attachment/attachment.js文件,

找到_this.fileList.push(json);替换成 _this.fileList[$file.index()] = json;

修改后的内容:

uploader.on('uploadSuccess', function (file, ret) {
    var $file = $('#' + file.id);
    try {
        var responseText = (ret._raw || ret),
            json = utils.str2json(responseText);
        if (json.state == 'SUCCESS') {
            //_this.fileList.push(json);
            _this.fileList[$file.index()] = json;
            $file.append('<span class="success"></span>');
        } else {
            $file.find('.error').text(json.state).show();
        }
    } catch (e) {
        $file.find('.error').text(lang.errorServerUpload).show();
    }
})

【特别提示】修改之后,记得清理下浏览器缓存和系统缓存!


« 上一篇

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。