CKEditor在jQuery UI上的內聯編輯

Question

我一直在使用CKEditor在jQuery UI上進行內聯編輯工作，尤其是在選項卡上。有誰知道如何使它工作？是否有任何插件可以使CKEditor在jQuery UI上工作？

Answer 1

自從今天早上我一直在努力解決同樣的問題，但我找到了一個解決方法。

var objCKeditor = new Object({ 
    config: base_url + "library/applications/ckeditor/config.simple.js" 
}); 
var objTab = new Object({ 
    active: false 
}); 
CKEDITOR.disableAutoInline = true; 
// Activate your editors when the tabs themselves are activated. 
$(".navigation-tabs").on("tabsactivate", function(event, ui) { 
    // Find which tab has been chosen by the user. 
    objTab.chosen = $(this).tabs('option', 'active'); 
    // Only initialize the editors once... 
    if ((objTab.chosen == 3) && (objTab.active == false)) { 
     // Loop through the editors. 
     $('div.link-bookmark-comment').each(function() { 
      // Find the ID for the editor. 
      objCKeditor.editor = $(this).attr('id'); 
       // ... which is facilitated by this boolean. 
       objTab.active = true; 
       CKEDITOR.inline(objCKeditor.editor, { customConfig: objCKeditor.config }); 
     }); 
    } 
}); 

所以，看起來CKEditor不喜歡放在標籤頁或任何最初隱藏的對象內。

Answer 2

我有一個類似的問題，原來是由於瀏覽器如何處理尚未呈現的「隱藏」或「禁用」組件。

http://ckeditor.com/ticket/9814給出了一個示例，在實例變爲就緒時添加一個偵聽器來更改readOnly狀態。

var ck = CKEDITOR.inline(element); 
ck.on('instanceReady', function(ev) { 
    var editor = ev.editor; 
    editor.setReadOnly(false); 
});