uniapp给富文本框重限制图片宽度超出屏幕

原创已于 2023-09-28 15:13:48 修改 · 606 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #uni-app

于 2023-05-15 18:32:43 首次发布

前端专栏收录该内容

9 篇文章

订阅专栏

这段代码主要用于处理HTML内容，移除<img>标签中的样式属性，删除宽度和高度定义，并确保图片最大宽度为100%，同时保持原始比例。它还处理了BR标签和全局的style属性，以适应更统一的显示效果。

	    RichTextnew(html) {
			let newheml = html.replace(/<img[^>]*>/gi, function(match,capture) {
				match = match.replace(/style="[^"]+"/gi, "").replace(/style='[^']+'/gi, "");
				match = match.replace(/width="[^"]+"/gi, "").replace(/width='[^']+'/gi, "");
				match = match.replace(/height="[^"]+"/gi, "").replace(/height='[^']+'/gi, "");
				return match;
			});
			newheml = newheml.replace(/style="[^"]+"/gi, function(match,capture) {
				match = match.replace(/width:[^;]+;/gi, "max-width:100%;").replace(/width:[^;]+;/gi, "max-width:100%;");
				return match;
			});
			newheml = newheml.replace(/<br[^>]*\/>/gi, "");
			newheml = newheml.replace(/\<img/gi,'<img style="max-width:100%;height:auto;display:block;margin-top:0;margin-bottom:0;"');
			return newheml;
	    }