通过在 tinymce 中显示去除 <![if !mso]>

Question

目前我正在使用tinymce 的一个非常旧的版本（2.8），现在我正在尝试将其升级到最新版本（4）。在这个过程中，我遇到了一些麻烦，主要是在旧版本中隐藏的 html 查看器中显示 <![if !mso]>，

我使用这个编辑器作为我的邮件编辑器，所以基本上我正在将响应式 html 邮件文本加载到编辑器中。但它在 html 查看器中显示了<![if !mso]> 这段代码，它没有被解释为注释。

我使用的代码，（根据example）

tinymce.init({
  selector: 'textarea',
  height: 500,
  theme: 'modern',
  plugins: [
    'advlist autolink lists link image charmap print preview hr anchor pagebreak',
    'searchreplace wordcount visualblocks visualchars code fullscreen',
    'insertdatetime media nonbreaking save table contextmenu directionality',
    'emoticons template paste textcolor colorpicker textpattern imagetools codesample'
  ],
  toolbar1: 'insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image',
  toolbar2: 'print preview media | forecolor backcolor emoticons | codesample',
  image_advtab: true,
  relative_urls : false
 });

任何人都知道我应该如何从 HTML 查看器中隐藏这个 <![if !mso]> 代码。请注意，这个 cmets 非常重要，所以我不想在加载到编辑器之前将它们从 html 代码中删除。我只需要隐藏它们。

Answer 1

这里的核心问题是<![if !mso]> 不是一个有效的 HTML 标签，因此 TinyMCE（作为 HTML 编辑器）将其视为文本。您可以在 TinyMCE 配置中使用 protect 选项教 TinyMCE 保护编辑器中的某些文本：

https://www.tinymce.com/docs/configure/content-filtering/#protect

例如你可以这样做：

tinymce.init({
    selector: textarea,
    protect: [
      /\<!\[if !mso\]\>/g,   // Protect <![if !mso]>
      /\<!\[if !vml\]\>/g,   // Protect <![if !vml]>
      /\<!\[endif\]\>/g,     // Protect <![endif]>
      /<\?php[\s\S]*?\?>/g   // Protect <?php ?> code
    ]
});

请注意，MS Office 文档放入了大量这些非标准标记标签，因此要捕获所有这些标签，您可能需要在 protect 配置选项中添加其他项目。