TinyMCE - 你如何使用onClick代替<a href=""> for links?</a>

Question

有没有办法改变TimyMCE的defalt行为，所以当你插入一个链接时，它会呈现这样的东西：

<span onclick="window.open('http://google.com', '_blank', 'location=yes');"></span>

而不是

<a href="http://www.google.com" target="_blank" location="yes"></a>

理想情况下，我希望通过“链接”按钮完成此操作，但可以在“提交”中完成。

ADDED ： 这样做的原因（我知道这似乎是不好的做法）是能够移植到PhoneGap（使用InAppBrowser插件），因为不适合浏览器使用。

Answer 1

忽略这不是一个好习惯，我会假设你有一个有效的用例，想要做这样的黑魔法。

但在此之前，需要考虑以下几点：

1. 我建议您在使用TinyMCE时将链接保留为链接。这样，您的用户就可以像往常一样插入和编辑它们。将它们更改为元素内部编辑器实际上将无法编辑它们而无需编辑完整源代码。您应该将它们转换为编辑器外的span元素。

2. 如果您是顽固型并且不关心＃1或您的用户，您应该注意默认的TinyMCE 4配置不允许span属性，因此您需要更新extended_valid_elements，否则将在清理过程中删除它们。

3. 可能有更好的方法来做你想做的事情。正如@Vic建议的那样，事件监听器可能是更好的选择。

尽管如此，我会幽默你。下面是一个工作示例的过程概述。

概述

如果您正在使用TinyMCE 3.x进行开发，则需要使用onSaveContent事件。如果您使用的是4.x，请使用saveContent事件。在这两种情况下，概念都是一样的。

只要编辑器的内容被“保存”，就会触发此事件。如果TinyMCE作为表单的一部分提交，则会自动发生，但您也可以使用tinymce.triggerSave()一次强制所有编辑器。

所以，只需设置你的回调函数，用邪恶的onclick替代品替换所有链接。您可以使用纯JS或TinyMCE的内置DOM实用程序（如果您已经熟悉它们，可能只是一个好主意），但为了清晰（和理智），使用jQuery会更容易。

工作示例

TinyMCE小提琴：http://fiddle.tinymce.com/mAdaab/1

1. 此示例使用TinyMCE 4
2. 打开浏览器的控制台以查看输出
3. 加载TinyMCE后，按span按钮
4. 生成的HTML将显示在您的控制台中

按照你的意愿做，但要记住，可能有更好的方法。

Answer 2

你提出的建议是一个非常糟糕的做法（就像不使用链接的锚标签一样）不会更容易实际给你的链接一个id或类，并用javascript附加事件监听器和点击防止默认行为抓住href属性并使用你的window.open？