TinyMCE - 你如何使用onClick而不是<a href=""> for links?

Question

Is there a way to change the defalt behaviour of TimyMCE, so that when you insert a link, it renders something like this:

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

instead of

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

Ideally, I would like this to be done by the Link button, but it could be done onSubmit.

ADDED: The reason for doing this (as I know it seems like bad practice) is to be able to port to PhoneGap (using the InAppBrowser插件），因爲它不適合瀏覽器使用。

Answer 1

俯視這真的不是一個好習慣，我會假設你有一個有效的用例，想要做這樣的黑魔法。

但在此之前，一些事情要考慮：

1. 我會建議你保持的鏈接，鏈接中TinyMCE的工作時。這樣，用戶就可以照常插入和編輯它們。將它們更改爲span元素內部編輯器實際上會消除在不編輯完整源代碼的情況下編輯它們的能力。您應該將它們轉換爲span元素外部的編輯器。

2. 如果你是頑固型和不關心＃1或你的用戶，你應該注意的是，默認的TinyMCE的4配置不允許onclick屬性，所以你需要更新extended_valid_elements，否則他們將在清理過程中被刪除。

3. 可能有更好的方法來做你想做的事情。正如@Vic所建議的，事件監聽器可能是更好的選擇。

不過，我會幽默你。下面是一個工作示例的過程概述。

概述

如果您正在使用的TinyMCE 3.x的發展，你會想進軍onSaveContent事件。如果您使用4.x，請使用saveContent事件。在這兩種情況下，這個概念都是一樣的。

只要編輯器的內容「保存」，該事件就會被觸發。如果將TinyMCE作爲表單的一部分提交，則會自動發生，但您也可以使用tinymce.triggerSave()一次強制執行所有編輯器。

所以，只需設置你的回調函數來替換所有帶有邪惡span替代的鏈接。您可以使用純JS或TinyMCE的內置DOM實用程序（如果您已經熟悉這些實用程序，可能只是一個好主意），但爲了清晰（並且清晰），使用jQuery更容易。

工作實例

TinyMCE的小提琴：​​

1. 本例使用TinyMCE的4
2. 打開瀏覽器的控制檯查看輸出
3. TinyMCE的加載後，按Save按鈕
4. 生成的HTML將出現在您的控制檯中

用它做什麼，但要記住，有可能有更好的方法。

Answer 2

你提出的是一個非常糟糕的做法（因爲在不使用鏈接的錨標記）不會更容易實際上給你的鏈接一個id或類和附加事件監聽與JavaScript和點擊防止默認behavour抓住href屬性並使用你的window.open？