欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

kindEditor富文本编辑器 设置图片最大宽度为100%

程序员文章站 2024-02-22 15:59:40
...

最近一个小程序项目  web端kindDditor富文本编辑器上传的图片在小程序端显示不正常。 只能修改编辑器源码,加上style="max-width:100%"

  方法如下:

       打开/kindeditor/kindeditor-all.js文件

       在大约3244行左右

      将 HTML加上 “style="max-width:100%"” (单单加这一句没用  后来应该被正则替换掉了 或者是重新设置了 style)

      后来发现 只要修改 

if (width) {
			html += 'width="' + _escape(width) + '" ';
		}

     为

html += 'max-width:100%';

即可(其实这一句并没有起修改style的作用  仅仅是为了不让正则替换  前边的“style="max-width:100%"” )

   这里width是获取用户设置的width

    加上这一句  前边的“style="max-width:100%"”也不会被替换掉  设置图片最大宽度为100%完成

   整个修改如下

 

 

insertimage : function(url, title, width, height, border, align) {//---------------------------------------------------------------------------------------
		title = _undef(title, '');
        border = _undef(border, 0);
        
        var html = '<img  style="max-width:100%" src="' + _escape(url) + '" data-ke-src="' + _escape(url) + '" ';///////////////////////////////////////////////////////////////////////////////
       

        
	    html += 'max-width:100%';
		
		if (height) {
			html += 'height="' + _escape(height) + '" ';
		}
		if (title) {
			html += 'title="' + _escape(title) + '" ';
		}
		if (align) {
			html += 'align="' + _escape(align) + '" ';
		}
		html += 'alt="' + _escape(title) + '" ';
		html += '/>';
		return this.inserthtml(html);
	},