2016-03-20 125 views
1

我使用CKEditor構建了一個簡單的網站構建工具。該工具可以選擇和設置調色板,這應該反映在CKEditor的樣式下拉列表中。不過,在我看來,CKEditor中不能覆蓋樣式。我目前的代碼是:在CKEditor中替換樣式

CKEDITOR.stylesSet.add('styles', [ 
    // Block-level styles 
    { name: 'blah 1', element: 'h2', styles: { 'color': '#xxxxxx' } }, 
    { name: 'blah 2', element: 'h3', styles: { 'color': '#xxxxxx' } }, 
    { name: 'blah 3' , element: 'h4', styles: { 'color': '#xxxxxx' } }, 
    { name: 'blah 4' , element: 'h5', styles: { 'color': '#xxxxxx' } }, 
]); 
CKEDITOR.config.stylesSet = 'styles'; 

現在,如果我重複這個新的風格,我得到:

ckeditor.js:232 Uncaught Error: [CKEDITOR.resourceManager.add] The resource name "styles" is already registered. 

我使用CKEDITOR.replace嘗試,但這並不解決這個問題。我想,明顯的解決方案是每次使用迭代樣式名稱; style1,style2,style3 ...但這不是非常資源友好。有沒有人有這個實際的解決方案?

感謝, 李

回答

-1

因此,我想出了一個解決方案,即在重新創建面板之前始終銷燬面板(如果存在)。例如:

if (CKEDITOR.instances['footer-' + i]) { 
    CKEDITOR.instances['footer-' + i].destroy(true); 
} 
var editor = CKEDITOR.inline('footer-' + i, { 
    stylesSet: [ 
    // Block-level styles 
    { name: 'Blue Title', element: 'h2', styles: { 'color': 'Blue' } }, 
    { name: 'Red Title' , element: 'h3', styles: { 'color': 'Red' } }, 
    { name: 'Brown Title' , element: 'h4', styles: { 'color': 'Red' } }, 
    { name: 'Purple Title' , element: 'h5', styles: { 'color': 'Red' } } 
    ] 
}); 

現在,這確實一個警告每次扔了,說:

[CKEDITOR] For more information about this error go to http://docs.ckeditor.com/#!/guide/dev_errors-section-editor-incorrect-destroy 

然而,世界上沒有乾淨的方式來做到這一點,否則用CKEditor的API,這樣以來它的工作原理,我將其標記爲答案。

+1

編輯器初始化後的修改樣式集帶來了以下問題: 1. [ACF](http://docs.ckeditor.com/#!/guide/dev_acf)根據提供的樣式創建其配置 - 例如,允許包含在樣式定義中的元素。 2.沒有信息如何處理已刪除樣式的內容(應刪除內容還是取消樣式?) 處理此問題的最佳方法是銷燬編輯器並使用更新創建一個新的樣式配置。另外,在JSFiddle/JSBin上發佈你的例子,以便更容易調查'錯誤 - 破壞'錯誤。 –

0

你試圖重新命名風格默認

我使用這個和它的工作原理,我的加載外部樣式文件。但相同的數組結構。

CKEDITOR.config.stylesSet = 'default:http://' + window.location.host + '/folder/fckeditor.styles.js'; 
+0

嗨,感謝您的評論。如果我這樣做,我會得到錯誤:「未捕獲的TypeError:無法讀取未定義的屬性'getEditor',這會打開一整個新的蠕蟲罐。 –

+0

還有其他改變嗎?我查了一下這個錯誤,看起來這個錯誤與你在替換命令中調用的textarea沒有關係。 – imvain2