將原子內容插入到CKEditor中

是否可以將「原子」塊內容插入到CKEditor中？將原子內容插入到CKEditor中

例如，我想在<p>A B C</p>的「B」之後插入<h1>Test</h1>。目前使用CKEDITOR.currentInstance.insertHtml('<h1>Test</h1>')，塊標籤被刪除，並且變爲<p>A BTest C</p>（在「B」之後的光標）。我希望它被插入到光標所在的P塊的末尾，如<p>A B C</p><h1>Test</h1>

這裏是一個工作示例http://jsfiddle.net/T49Pf/3/。當插入符號位於第一段的任何位置，然後單擊「插入」時，我沒有插入h1標籤。但是當插入符號位於第二個（空白）段落時，我確實有h1塊元素。現在，當我點擊任意位置的「插入」時，內容會插入到保持原子的位置（不要丟失h1標記）。它類似於「魔術線」插件。

來源

2013-08-27 jcisio

哪個CKEDITOR的版本您使用的？ – stackunderflow

[高級內容過濾]（http://docs.ckeditor.com/#!/guide/dev_advanced_content_filter） – Reinmar

這是CKEditor的最新版本：4.2.0。我剛剛添加了一個實例。它不是ACF，因爲當插入符號處於空白段落時，我確實有原子內容（我也選擇標準工具欄來啓用H1）。 – jcisio

我假設你正在使用editor.insertHtml方法。此方法的行爲被設計用於粘貼代碼，而您的情況通常意味着單行或部分行被複制，因此應將其作爲文本進行處理 - 而不是格式。

在你的情況下，我建議editor.insertElement方法是用於不同的目的（如圖像插入），所以它會保留你的元素。從文檔

樣品：

var element = CKEDITOR.dom.element.createFromHtml('<img src="hello.png" border="0" title="Hello" />'); 
CKEDITOR.instances.editor1.insertElement(element);

來源

2013-08-27 20:13:53 Reinmar

是的，它是editor.insertHtml。這是一個錯誤的問題，但在jsfiddle的代碼是正確的。我將用insertElement進行測試。 – jcisio

沒有真正回答這個問題（插入到當前塊元素的末尾），但這正是我想要做的。演示http://jsfiddle.net/T49Pf/4/。謝謝！ – jcisio

我沒有注意到額外的要求。您可以修改選擇，以便將其放在您想要的位置，然後插入。 – Reinmar

標題標籤（h1-6）是塊級元素不能被嵌套在<p>標籤內...

來源

2013-08-27 20:08:57 bluetoft

但我喜歡在* P標籤之後插入它，而不是將其剝離。 – jcisio

將原子內容插入到CKEditor中

回答

相關問題