TinyMCE 图像自定义哈希

Question

我正在使用TinyMCE编辑器处理一些旧网页内容。 所有HTML内容都可以包含"链接"到格式为".. <img src="##IMAGE:1234##"/> .."的图像。 我需要在HTML预览中显示图像，但在代码中它必须保持格式"..<img src="##IMAGE:1234##"/>..

我知道下载/内联所有图像的URL=> http://example.com/images/1234

我是否需要解析编辑器内容，将 IMG src 替换为原始 IMG src 中的 URL + ID (##IMAGE:1234##(。

有没有办法，如何在HTML代码模式下有这样的"..<img src="##IMAGE:1234##"/>.."，但在预览模式下显示图像？

谢谢

Answer 1

TinyMCE依靠浏览器来呈现您提供给编辑器的HTML。 由于您提供的当前src无效，因此不会显示图像。

我的建议是使用data-xxx来存储所需的值，并在将内容放入编辑器时以编程方式设置src属性。

例如。。。

您可以将图像标记作为<img data-imgsrc="##IMAGE:1234##" />存储在数据库中。 当您准备好将内容加载到编辑器中时，将src属性添加到图像标记中，以便最终得到<img data-imgsrc="##IMAGE:1234##" src='http://example.com/images/1234' />. 这允许编辑器渲染图像。

当您将 HTML 内容保存回数据库时，您可以从任何也具有data-imgsrc属性的图像中删除src属性(假设您出于某种原因需要执行此操作(。