html - 如何配置 TinyMCE 以允许 anchor (a) 标记内的 block 级元素？

Question

这是我的场景:

我希望能够创建这样的内容

<div> <a id="supportTile" class="contentModule" href="/Support"> <h2>Support</h2> </a> </div>

然而 tinyMCE 将其剥离为

<div> <h2>Support</h2> </div>

我目前的配置是这样的(使用 TinyMCE jQuery):

script_url: _applicationRoot + "Scripts/tiny_mce/tiny_mce.js",
theme: "advanced",                    
plugins: "paste,filemanager,imagemanager,advimage,inlinepopups",
...
extended_valid_elements: "img[!src|border:0|alt|title|width|height|style|name|id|class],a[href|target|title|onclick|name|id|class],article[name|id|class],div[name|id|class],section[name|id|class]",
schema: "html5",               
...
convert_urls: true,
document_base_url: _applicationRoot

我尝试设置 verify_html: false 但没有成功。

我尝试删除 extended_valid_elements 并将其替换为:

valid_elements: "*[*]",
verify_html: false

也不走运。

你能看出我的配置有问题吗？这完全可以实现吗？

谢谢!

Answer 1

是的，这应该是可以实现的。为了能够产生像

这样的输出

<div> <a id="supportTile" class="contentModule" href="/Support"> <h2>Support</h2> </a> </div>

您必须修改 tinymce 设置 valid_children和有效元素。您需要注意，您可能需要放大一个默认设置。

valid_elements: "*[*]" 将无法工作，因为有一个错误，希望在最新或下一个版本中被删除。

我使用这个设置(我不使用 div 或 h2s)

valid_elements: "@[id|class|title|style],"
+ "a[name|href|target|title|alt],"
+ "#p,-ol,-ul,-li,br,img[src|unselectable],-sub,-sup,-b,-i,-u,"
+ "-span[data-mce-type],hr",

valid_child_elements : "body[p,ol,ul]"
+ ",p[a|span|b|i|u|sup|sub|img|hr|#text]"
+ ",span[a|b|i|u|sup|sub|img|#text]"
+ ",a[span|b|i|u|sup|sub|img|#text]"
+ ",b[span|a|i|u|sup|sub|img|#text]"
+ ",i[span|a|b|u|sup|sub|img|#text]"
+ ",sup[span|a|i|b|u|sub|img|#text]"
+ ",sub[span|a|i|b|u|sup|img|#text]"
+ ",li[span|a|b|i|u|sup|sub|img|ol|ul|#text]"
+ ",ol[li]"
+ ",ul[li]",