一、概述
当集成Editor.md编辑器的时候发现不能像简书那样动态的设置图片的尺寸。但是可以做如下的修改实现在编辑过程中根据设置展示尺寸。
参考CSDN 当需要图片大小时可以如下
![图片描述](url =100x100)
而Editor.md如下
![图片描述](url)
二、修改步骤
首先找到marked.min.js这个文件
然后定位Renderer.prototype.image 这个就是生成图片html的位置,原代码如下:
Renderer.prototype.image = function(href, title, text) {
var out = '<img src="' + href + '" alt="' + text + '"';
if (title) {
out += ' title="' + title + '"'
}
out += this.options.xhtml ? "/>" : ">";
return out
}
简单修改一下:
Renderer.prototype.image = function(href, title, text) {
var array = href.split("=");
var width;
var height;
if(array.length == 2){
href = array[0];
var resolution = array[1].split("x");
if (resolution.length == 2){
width = resolution[0]
height = resolution[1];
}
}
var out = '<img src="' + href + '" alt="' + text + '"';
if (title) {
out += ' title="' + title + '"'
}
if(width){
out += ' width="' + width + '"'
}
if(height){
out += ' height="' + height + '"'
}
out += this.options.xhtml ? "/>" : ">";
return out
};
详情参考官网:https://pandao.github.io/editor.md/examples/index.html
网友评论