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); 
});