wangeditor-team / wangEditor

wangEditor —— 开源 Web 富文本编辑器
http://www.wangeditor.com/
MIT License
17.37k stars 3.31k forks source link

插入一个img标签时,没有任何问题,但是插入一个span标签,并且标签中加入了img标签,img标签就不存在了 #5892

Open heimayouzi opened 2 months ago

heimayouzi commented 2 months ago

问题描述

当想插入一个img标签时,没有任何问题,但是插入一个span标签,并且标签中加入了img标签,img标签就不存在了

wangEditor 版本

5.1.23

是否查阅了文档 ?

最小成本的复现步骤

微信截图_20240701164423

cycleccc commented 2 months ago

wangeditor 会对 样式格式化,会过滤掉大部分原有样式,这样做是为了保证富文本编辑器的格式统一方便底层修改。

cycleccc commented 2 months ago

有更具体的需求吗,不建议 用 span 套 img,这也不符合标签语义化

heimayouzi commented 2 months ago

那应该怎么去操作呢,我们现在的产品是bi产品,比如有一个tooltip,我们有一个显示的字段需要在富文本中进行展示,比如AAA字段,因为wang富文本里面没有块的含义,所以就把AAA字段转换为图片,但是图片没有办法设置样式,所以就想在外面套一层span,这样就可以把span的样式拿到,最后把图片转为AAA文字,就可以设置样式了

cycleccc commented 2 months ago

这种情况建议用自定义扩展,这是你需求现在最合理的做法,因为比较个性化,你可以自定义一个块级的扩展,传入样式和解析出样式,具体看自定义扩展 以及wangeditor官方的 扩展 demo和网上其他人写的扩展,仿写改写。

cycleccc commented 2 months ago

你的需求是一个可以设置样式的块级文本容器,对吧,这个用自定义扩展是比较好做的。

cycleccc commented 2 months ago

比较简单的方式是参考wangeditor-next,我在image-module做了 sytle 属性的扩充,你改改,改成块级文本容器就能用了。

cycleccc commented 1 month ago

@KongXiao-H 在 setHtml之前把嵌套在 div 内的 img 过滤一下,避免不必要的 div嵌套

KongXiao-H commented 1 month ago

@KongXiao-H 在 setHtml之前把嵌套在 div 内的 img 过滤一下,避免不必要的 div嵌套

如果我需要这个图片,是不是需要把<div><img /></div>都变成<img />。🤔

cycleccc commented 1 month ago

@KongXiao-H 对的,暂时是这样,后续有空了我可能会处理,但是这是个会将复杂度提升很多的活

KongXiao-H commented 1 month ago

好的,非常感谢。🤗

Jack-rainbow commented 3 weeks ago

@cycleccc 您好,想咨询一个问题.

需求:

从wps拷贝图片到富文本中文字正常显示,图片显示裂图.

wangEditor版本:

5.1.23

是否查阅了文档:

问题描述:

从wps里边拷贝图文到富文本里边,发现图片裂图没有默认样式,然后我通过css加了样式,效果可以满足,但是发现有点鸡肋.所以我想让img自动根据自身的宽高去设置宽高.,有什么思路提供嘛?

其他 自定义拓展发现有点负重大,但是并没有去真正尝试.

cycleccc commented 3 weeks ago

@Jack-rainbow 方便的话可以在 wangeditor-next 开个 issue ,太多要处理的了,在这里回复完我指不定后面又忘了。

cycleccc commented 3 weeks ago

@Jack-rainbow 我用 wps 测试了没有裂图,宽高在 wangeditor-next 里有支持,复现的话需要更多的信息,方便的话可以提供一下你的复现文件。