CKEDITOR剥离按钮内的锚标签

Question

我有一段像这样的HTML代码

<button class="login_btn"><a href="#">Login</a></button>

但是当我应用CKEDITOR内联编辑器时，它转向

<button class="login_btn">Login</button>

我尝试使用

config.allowedContent = true;

和

config.extraAllowedContent = 'button(*){*};a(*){*};';

但问题仍然存在。我不希望任何事情被剥夺。

Answer 1

CKEditor正在从<a>中剥离<button>，因为<button> 不能包含 <a>元素。使用HTML validator检查您的HTML。

来自html5 button spec：

  

必须没有interactive content后代。

interactive content页面列出了锚标记<a>作为第一个示例。

Answer 2

如果您需要强制修复它，您可以添加配置（您只需在 ckeditor 文件夹中的config.js末尾添加一行）：

CKEDITOR.dtd.button.a = 1;

这意味着：您在标记<a>内的编辑器标记<button>中允许。它对我有用。

Answer 3

您是否尝试过使用其他HTML编辑器，例如CoffeCup或Sublime Text？我认为这只是编辑的一个问题。我已经尝试过你的代码了，它运行正常。