如何阻止TinyMCE通过API转换HTML内容？

我明白你现在遇到的棘手问题：为了适配Crystal Reports的HTML格式要求，你已经自定义了TinyMCE的格式规则，但调用setContent时传入的HTML还是被自动转换，破坏了原本需要的标签结构。下面是针对性的解决方案，一步步帮你搞定：

1. 调整TinyMCE核心配置，禁用不必要的转换 #

首先，你需要在tinymce.init里添加几个关键配置，从根源上阻止编辑器修改你的原始HTML结构：

tinymce.init({
  // 你的其他原有配置...
  formats: {
    bold: { inline: 'b' },
    italic: { inline: 'i' },
    underline: { inline: 'u' },
    forecolor: { inline: 'font', attributes: { color: '%value' } }
  },
  // 禁止自动添加/强制转换根块元素（比如默认把内容包成<p>）
  forced_root_block: false,
  // 明确允许Crystal Reports需要的HTML元素，避免被过滤或转换
  valid_elements: 'b,i,u,font[color],p,br,span',
  // 禁用将font标签转换为span的默认行为
  convert_fonts_to_spans: false,
  // 关闭自动清理HTML的严格模式，保留原始标签结构
  verify_html: false,
  // 排除不需要的元素，防止编辑器把b转成strong这类默认转换
  invalid_elements: 'strong,em'
});

关键配置说明： #

• forced_root_block: false：TinyMCE默认会把所有内容强制包裹在<p>标签里，这个配置会禁用该行为，完整保留你传入的原始块级结构。
• valid_elements：通过白名单机制，只允许你列出的元素存在，确保Crystal Reports依赖的<b>、<i>、<u>、<font>不会被过滤或篡改。
• convert_fonts_to_spans: false：默认情况下TinyMCE会把<font>转成<span>，这个配置直接阻止该转换，保留<font>标签用于颜色设置。
• invalid_elements：明确禁止TinyMCE偏好的<strong>、<em>等标签，避免编辑器自动把你的<b>转成<strong>。

2. 调用setContent时使用原始格式插入 #

除了编辑器配置，在调用setContent的时候，加上{ format: 'raw' }参数，让编辑器直接插入原始HTML，不进行任何解析转换：

tinymce.activeEditor.setContent(d.Template, { format: 'raw' });

这个参数会明确告诉TinyMCE：“直接用我给的HTML内容，不要做任何修改”，从调用层面彻底避免转换问题。

3. 测试验证 #

配置完成后，你可以传入示例HTML（比如<p> Welcome to the <b>Crystal Reports</b> demo <font color="red">with TinyMCE</font></p>），然后通过tinymce.activeEditor.getContent({ format: 'raw' })获取内容，检查是否和传入的原始HTML一致：

• <b>没有被转换成<strong>
• <font color="red">保留原样，没有变成<span style="color: red">
• <p>标签结构没有被修改或移除

这样配置后，TinyMCE就能完美适配Crystal Reports需要的HTML格式，不会再擅自转换你的内容了。

内容的提问来源于stack exchange，提问作者Brian Mains