Ueditor 自动设置上传图片的宽度或高度

Uedior在上传图片的生活,需要自动设置上传图片的宽度或高度属性。该方法只能用于多图上传组件,单图上传无法使用。

该方法基于 ueditor 1.4.3 版本制作:

1.添加属性字段,在config.json文件中:

/* 上传图片配置项 */字段下添加:
    "imageWidth": 700, /* 上传图片宽度指定, 1.4.3官方版本无此参数,自行添加*/
    "imageeight": 700, /* 上传图片高度指定, 1.4.3官方版本无此参数,自行添加*/
    "imageSide": 1, /* 多图上传图片尺寸设置方式,0为不指定,1为按照宽度,2为按照高度,3为同时指定 1.4.3官方版本无此参数,自行添加*/

2.修改插入图片js语言逻辑,在image.js文件中:

UploadImage中:
getInsertList: function ()(约:L774)
复制代码
        getInsertList: function () {
            var i, data, list = [],
                align = getAlign(),
                prefix = editor.getOpt('imageUrlPrefix');
            for (i = 0; i < this.imageList.length; i++) {
                data = this.imageList[i];
                var temp = {};
                temp["src"] = prefix + data.url;
                temp["_src"] = prefix + data.url;
                temp["title"] = prefix + data.title;
                temp["alt"] = prefix + data.original;
                temp["floatStyle"] = prefix + data.align;
                if (editor.getOpt('imageSide')==1||editor.getOpt('imageSide')==3)
                    temp["width"] = editor.getOpt('imageWidth');
                if (editor.getOpt('imageSide')==2||editor.getOpt('imageSide')==3)
                    temp["height"] = editor.getOpt('imageHeight');
                list.push(temp);

                // list.push({
                //     src: prefix + data.url,
                //     _src: prefix + data.url,
                //     title: data.title,
                //     alt: data.original,
                //     floatStyle: align
                // });
            }
            return list;
        }
复制代码

PHP7.0+Ueditor1.4.3实测通过。 

 

posted @   Sunky  阅读(4064)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
阅读排行:
· winform 绘制太阳,地球,月球 运作规律
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· AI与.NET技术实操系列(五):向量存储与相似性搜索在 .NET 中的实现
· 超详细:普通电脑也行Windows部署deepseek R1训练数据并当服务器共享给他人
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
点击右上角即可分享
微信分享提示