防止 TinyMCE 移除跨度元素 [英] Prevent TinyMCE from removing span elements

查看：36 发布时间：2021/9/8 18:43:29 tinymce

本文介绍了防止 TinyMCE 移除跨度元素的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

这里是问题演示

您可以在这里尝试:http://fiddle.tinymce.com/SLcaab

这是 TinyMCE 默认配置

This is TinyMCE default configuration

1 - 打开 Html 源代码编辑器

1 - Open the Html Source Editor

2 - 将此 html 粘贴到 Html 源代码编辑器中:

2 - Paste this html into the Html Source Editor:

<p><span>Hello</span></p>
<p><a href="http://www.google.com">Google 1</a></p>
<p><a href="http://www.google.com">Google 2</a></p>

3 - 在 Html 源代码编辑器中单击更新以将 html 粘贴到编辑器中

3 - Click update in the Html Source Editor to paste the html in the editor

4 - 请记住，'Hello' 周围有一个跨度.

4 - Remember there is a span around 'Hello'.

5 - 将光标放在 Google 2 之前并按退格键(两个链接应合并在同一段落元素内).

5 - Place your cursor just before Google 2 and press backspace (the two links should merge inside the same paragraph element).

6 - 使用 Html 源代码编辑器查看生成的 html.

6 - Look at the resulting html using the Html Source Editor.

结果(问题):即使我们在 TinyMCE 设置中将span"添加到 extended_valid_elements 中，html 文档中也没有更多的 span.

Result (problem): No more span in the html document even though we added 'span' to the extended_valid_elements in the TinyMCE settings.

注意:我删除了所有插件以确保问题是 TinyMCE 的核心.

Note: I removed all the plugins to make sure the problem is at the core of TinyMCE.

编辑 1 - 我也尝试过: valid_children : "+p[span]" - 仍然不起作用

Edit 1 - I also tried: valid_children : "+p[span]" - still does not work

编辑 2:仅在 WebKit 上重现(在 Firefox 和 IE 上可以)

Edit 2: Only reproduced on WebKit (OK on Firefox and IE)