配置 TinyMCE 4 以允许内联元素或锚标记 (a) 成为顶级元素答案

【问题标题】：Configure TinyMCE 4 to allow inline element or anchor tag (a) to be the top level element配置 TinyMCE 4 以允许内联元素或锚标记 (a) 成为顶级元素
【发布时间】：2016-08-22 15:58:56
【问题描述】：

基本上，我想放置一个锚元素作为顶级元素，但每次关闭源代码面板时，TinyMCE 都会强制执行它自己的想法。

免责声明：TinyMCE 是一个了不起的免费所见即所得编辑器工具。我只是度过了非常糟糕的一天。

让我很痛苦的是 TinyMCE，据称是“最先进的所见即所得的 html 编辑器”，在保存或关闭源代码视图的那一刻，通常甚至不能让你输入你想要的 html 而不会为你搞砸。

我想做的就是关闭编辑器，让我的代码（甚至只是锚元素）完好无损。但无论我将什么选项或配置传递给 TinyMCE，它都会反复撕裂我的代码；漫不经心地散布文档中的元素，就像破碎的梦想碎片。

<!-- Casually transforming this -->

<a class="box" href="#">
 <div class="title">Box Title</div>
 <p>This is the box content!</p>
</a>

<!-- into this -->

<p><a class="box" href="#"></a></p>
<div class="title"><a class="box" href="#">Box Title</a></div>
<p><a class="box" href="#">This is the box content!</a></p>
<p></p>

出于某种他们自己最熟悉的原因，他们删除了拯救生命的清理选项，允许您完全禁用此可憎，我无法让任何 valid_elements/children 选项正常工作。 (a[*] 等)

在过去的 3 个小时里，我一直在搜索他们的文档、论坛和堆栈溢出，但无济于事。我唯一的安慰终于是able to put block-level elements within anchor tags，但这只能解决我的部分问题。

我面临的主要问题是 TinyMCE 不允许我在顶层放置包含块级元素的锚标记。有人知道如何配置 TinyMCE 以允许这样做吗？

TinyMCE 代码（精简至相关）：

tinymce.init({
    selector: 'textarea.wysiwyg',
    schema: "html5",        
    element_format : 'html',
    plugins: ['codemirror'],
    convert_urls: false,
    valid_elements: "*[*]",
    valid_children: "+body[a],+a[div|h1|h2|h3|h4|h5|h6|p|#text]",
    //apply_source_formatting: false,                // removed I think
    //verify_html: false,                            // removed :'(
    codemirror: { indentOnInit: true },
    content_css: '/Content/Styles/Sass/main.css'
});

【问题讨论】：

标签： javascript html tinymce wysiwyg tinymce-4

【解决方案1】：

解决方法是禁用forced_root_block。

tinymce.init({
    ...
    forced_root_block : false, // default = 'p' >= 3.0a1
});

此功能自动确保任何非块元素或文本节点都包裹在块元素中。

例如something 将产生类似something 的输出。

Documentation Reference

【讨论】：